PDA

View Full Version : [CLOSED] Load combobox dynamically inside gridpanel editorfield



matrixwebtech
Jul 09, 2014, 8:16 PM
Hi
I write code as bellow

VIEW CODE


@model System.Collections.IEnumerable[]
@using Ext.Net
@using Ext.Net.MVC
@{
ViewBag.Title = "ComboBox with Template - Ext.NET MVC Examples";

var X = Html.X();
}


<script>

var addPlant = function () {

var r = Ext.create('pr', {
//common: 'New Plant 1',
//light: 'Mostly Shady',
//price: 0,
//availability: Ext.Date.clearTime(new Date()),
//indoor: false


}),
grid = App.GridPanel1;

grid.store.insert(0, r);
grid.editingPlugin.startEditByPosition({ row: 0, column: 0 });
};

var beforeEdit = function (ed, e) {
var field = this.getEditor(e.record, e.column).field;

switch (e.field) {
case "stateid":
field.allQuery = e.record.get('countryid');

break;
case "cityid":
field.allQuery = e.record.get('stateid');
break;



}
};

var countryRenderer = function (value) {
// alert(value)
var r = App.CountryStore.getById(value);

if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
//console.log(r.data.Text)
return r.data.Text;
};
var stateRenderer = function (value) {
var r = App.StateStore.getById(value);
console.log(r)
if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
console.log(r)
return r.data.state;
};
var cityRenderer = function (value) {
var r = App.CityStore.getById(value);
console.log(r)
if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
// console.log(r.data.city)
return r.data.city;
};

</script>


@X.ResourceManager()

@(X.Store()
.ID("CountryStore")
.Model(
X.Model()
.IDProperty("countryid")
.Fields(
X.ModelField()
.Name("Text")
.ServerMapping("Text")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("countryid")
.ServerMapping("countryid")
.Type(ModelFieldType.String)

)
)
.DataSource(Model[1])
)

@(X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)
)

.Proxy(X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(X.JsonReader().Root("data"))
)
)

@(X.Store()
.ID("CityStore")
.Model(X.Model()
.IDProperty("cityid")
.Fields(
X.ModelField()
.Name("cityid")
.Mapping("cityid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("city")
.Mapping("city")
.Type(ModelFieldType.String)
)
)
.Proxy(X.AjaxProxy()
.Url(Url.Action("GetCities"))
.Reader(X.JsonReader().Root("data"))
)
)




@(X.GridPanel()
.ID("GridPanel1")
.TopBarItem(X.Button().Text("Add").Listeners(le => { le.Click.Fn = "addPlant"; }).Icon(Icon.Add)
)
.Listeners(l =>
{
l.ViewReady.Fn = "addPlant";
l.ViewReady.Delay = 1;
})
.Frame(true)
.Features(X.Summary())
.Height(300)
.Width(600)
.Title("Grid")
.ForceFit(true)
.Store(X.Store()
.ID("Store1")
.Model(X.Model()
.Name("pr")
.Fields(

X.ModelField()
.Name("countryid")
.Type(ModelFieldType.String),
X.ModelField()
.Name("Text")
.Type(ModelFieldType.String),

X.ModelField()
.Name("stateid")
.Type(ModelFieldType.String),
X.ModelField()
.Name("state")
.Type(ModelFieldType.String),



X.ModelField()
.Name("cityid")

.Type(ModelFieldType.String),
X.ModelField()
.Name("city")

.Type(ModelFieldType.String),

X.ModelField()
.Name("population")

.Type(ModelFieldType.Int),

X.ModelField()
.Name("men")

.Type(ModelFieldType.String),

X.ModelField()
.Name("women")

.Type(ModelFieldType.String)


)
)
.DataSource(Model[0])

)
.View(
Html.X().GridView().MarkDirty(false)
)

.ColumnModel(
X.Column()
.DataIndex("countryid")
.Text("Country")
.Renderer("countryRenderer")
.Editor(X.ComboBox()
.QueryMode(DataLoadMode.Local)
//.TriggerAction(TriggerAction.All)
.StoreID("CountryStore")
.ValueField("countryid")
.DisplayField("Text")
),

X.Column()
.DataIndex("stateid")
.Text("State")
.Renderer("stateRenderer")
.Editor(X.ComboBox()
.ID("ddlstate")
.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
.StoreID("StateStore")
.ValueField("stateid")
.DisplayField("state")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
),

X.Column()
.DataIndex("cityid")
.Text("City")
.Renderer("cityRenderer")
.Editor(X.ComboBox()
.ID("ddlcity")
.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
.StoreID("CityStore")
.ValueField("cityid")
.DisplayField("city")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
),

Html.X().SummaryColumn()
.Width(75)
.Text("Population")
.DataIndex("population")
.SummaryType(SummaryType.Sum)
.Renderer("return value ;")
.SummaryRenderer("return value ;")
.Editor(
Html.X().NumberField().AllowBlank(false).MinValue( 0).StyleSpec("text-align:left")
),

X.Column()
.DataIndex("men")
.Text("Men")
.Editor(X.TextField()
.ID("txtMen")

.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
)
,
X.Column()
.DataIndex("women")
.Text("Wo-Men")
.Editor(X.TextField()
.ID("txtwomen")

.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
)
,
Html.X().ImageCommandColumn()
.Width(30)
.Commands(
Html.X().ImageCommand()
.Icon(Icon.Bin)
.ToolTip(t =>
{
t.Text = "Delete plant";

})
.CommandName("delete")
)
.Listeners(l =>
{
l.Command.Handler = "this.up('gridpanel').store.removeAt(recordIndex);";

})




)
.Plugins(X.CellEditing()
.Listeners(events => {
events.BeforeEdit.Fn = "beforeEdit";
})
.ClicksToEdit(1)
.DirectEvents(events =>
{
events.Edit.Action = "Edit";

events.Edit.EventMask.ShowMask = true;
events.Edit.EventMask.CustomTarget = "App.GridPanel1";
events.Edit.ExtraParams.Add(new Parameter { Name = "field", Value = "e.field", Mode = ParameterMode.Raw });
events.Edit.ExtraParams.Add(new Parameter { Name = "index", Value = "e.rowIdx", Mode = ParameterMode.Raw });
events.Edit.ExtraParams.Add(new Parameter { Name = "recordData", Value = "e.record.data", Mode = ParameterMode.Raw });
})
)


)
@(X.Button().Text("Save").Icon(Icon.DatabaseSave).DirectEvents(d =>
{

d.Click.Action = "save";

d.Click.ExtraParams.Add(new Parameter
{
Name = "values",
Value = "Ext.encode(#{GridPanel1}.getRowsValues())",
Mode = ParameterMode.Raw
});


})
)


CONTROLLER CODE


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Ext.Net;
using Ext.Net.MVC;
using System.Text;
namespace ERP_test.Controllers
{
public class masterdetailsController : Controller
{
//
// GET: /masterdetails/

public ActionResult Index(string id)
{
List<object> countries = new List<object>(10);
List<object> states = new List<object>(10);
for (int i = 1; i <= 10; i++)
{
countries.Add(new { Text = "C" + i,countryid=i });
}

if (id == "edit")
{

return View(new IEnumerable<object>[]
{
new List<object>
{
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "25",men="58",women="25"},
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "65",men="45",women="65"},
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "2", population = "56",men="67",women="89"},
},
countries
});
}
else
{
return View(new IEnumerable<object>[]
{
new List<object>
{

new {country = "", state = "", city = "", population = "0",men="0",women="0"},
},
countries
});
}
}

public ActionResult GetStates(string query)
{
List<object> states = new List<object>(10);
if (string.IsNullOrEmpty(query) == false)
{
for (int i = 1; i <= 10; i++)
{
states.Add(new { stateid=i,state = query + "_S" + i });
}
}


return this.Store(states);
}

public ActionResult GetCities(string query)
{
List<object> cities = new List<object>(10);
if (string.IsNullOrEmpty(query) == false)
{
for (int i = 1; i <= 10; i++)
{
cities.Add(new { cityid=i,city= query + "_C" + i });
}
}

return this.Store(cities);
}



public ActionResult Edit(string field, string recordData, int index)
{
List<string> fields = new List<string> { "country", "state", "city", "population", "men", "women" };
int startIndex = fields.IndexOf(field);
JsonObject data = JSON.Deserialize<JsonObject>(recordData);
ModelProxy record = X.GetCmp<Store>("Store1").GetAt(index);
Random r = new Random();
switch (field)
{
case "cityid":
record.Set(fields[3], r.Next(10, 200).ToString());
record.Set(fields[4], r.Next(10, 200).ToString());
record.Set(fields[5], r.Next(10, 200).ToString());
break;
}



return this.Direct();
}

public ActionResult save(string values)
{
string json = values;
Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
StringBuilder sb = new StringBuilder();
foreach (Dictionary<string, string> row in companies)
{
foreach (KeyValuePair<string, string> keyValuePair in row)
{
sb.Append(keyValuePair.Key);
}
foreach (KeyValuePair<string, string> keyValuePair in row)
{
sb.Append(keyValuePair.Value);
}
}
return this.Direct();
}

}
}

run this and go to edit mode [http://localhost:####/masterdetails/index/edit]

I am trying to load this grid if the page open as edit mode,for that I write bellow code


if (id == "edit")
{

return View(new IEnumerable<object>[]
{
new List<object>
{
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "25",men="58",women="25"},
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "65",men="45",women="65"},
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "2", population = "56",men="67",women="89"},
},
countries
});
}

but state and city combo not fill with these value.
I click on save button , and debug

public ActionResult save(string values)
values parameter and found stateid and cityid present ,that means the value I send to view on edit time is bind with combo but not displaying.
please let me know what is the best ay to do this.

Daniil
Jul 10, 2014, 10:21 AM
Hi @matrixwebtech,


but state and city combo not fill with these value.

I don't see where you populate the ComboBoxes' Stores? As far as I can understand you don't. So, the Stores are empty and this code of stateRenderer and cityRenderer is being executed:

if (Ext.isEmpty(r)) {
return "";
}

I would say you should populate the ComboBoxes' Stores.

matrixwebtech
Jul 10, 2014, 11:15 AM
Hi daniil
thanks for reply

If you run this code as edit mode ,I try to populate grid view
combobox(state and city combo) with that list data,which I pass into view on edit mode.

As per you Store not populate for state and city combobox.

so my question is how I populate store for that situation?

now I populate store with bellow code.and i think this is need for the lienked field functionality.


.Proxy(X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(X.JsonReader().Root("data"))

so can you please tell how do i populate stores on edit mode situation of my sample.

Daniil
Jul 10, 2014, 11:25 AM
I would try with a Store's .DataSource(data) as you do with other Stores.

matrixwebtech
Jul 10, 2014, 11:46 AM
can you please provide me some sample code for this situation

Daniil
Jul 10, 2014, 11:54 AM
Well, you already have it in your code for other Stores.

matrixwebtech
Jul 10, 2014, 12:31 PM
If i use this code then its work fine and edit mode and data load in combos,but other functionality like populate sate according country not done.


X.Column()
.DataIndex("stateid")
.Text("State")
.Renderer("stateRenderer")

.Editor(X.ComboBox()
.ID("ddlstate")

.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
//.StoreID("StateStore")
.Listeners(l => { l.AfterRender.Handler = "stateRenderer"; })
.ValueField("stateid")
.DisplayField("state")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
.Store
(
X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)
)
.DataSource(Model[2])


)
)
and if i use bellow code


X.Column()
.DataIndex("stateid")
.Text("State")
.Renderer("stateRenderer")

.Editor(X.ComboBox()
.ID("ddlstate")

.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
//.StoreID("StateStore")
.Listeners(l => { l.AfterRender.Handler = "stateRenderer"; })
.ValueField("stateid")
.DisplayField("state")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
.Store
(
X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)
)
.DataSource(Model[2])

.Proxy(X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(X.JsonReader().Root("data"))
)
)
)
state load according to country but edit mode state combo not populate.can you please give me a solution for that.

Daniil
Jul 10, 2014, 1:15 PM
Please demonstrate how you have changed the Index controller action.

matrixwebtech
Jul 10, 2014, 1:32 PM
Hi daniil

For better understanding this situation please run my code(which i provide at no #1) at your end once,
If you follow my code at Index action you can see I use an edit parameter .you please run this code with and without edit

run this without edit mode http://localhost:####/masterdetails/index (From here user will entry data.)

run this and go to edit mode http://localhost:####/masterdetails/index/edit (From here user can edit previous data and can insert new data also.for that i need to display data entered previously.)


I think you will understand what I actually want to do.

Daniil
Jul 10, 2014, 1:48 PM
Well, I think I more or less understand what you need. Could you, please, do that?

Please demonstrate how you have changed the Index controller action.

matrixwebtech
Jul 10, 2014, 4:17 PM
I am not getting you.but I describe here with screen shot what functionality I relay need

13481

Above image you can see 2 section.
Section 1. Contain some fields.
Section 2.Contains a gridpanel.I concern about this 2nd panel's grid.here this grid has 6 columns same as my grid panel.
Now my point is
1st Point.my application user entry from this type screen
2nd Point.then me view all entry and edit if need.and save again

So for 1st point(user entry part) I think I will manage ,but I am facing problem with 2nd Point.where I can view previously entered data in same format(I will not create any other view,I reuse same view for insert and update operation).

If you check my code and run this without edit you can see all data populate properly,and and all things are fine.but in edit mode sate and city combo not populate.

then I try to populate state combo without Proxy parameter of store.


X.Column()
.DataIndex("stateid")
.Text("State")
.Renderer("stateRenderer")

.Editor(X.ComboBox()
.ID("ddlstate")

.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
//.StoreID("StateStore")
.Listeners(l => { l.AfterRender.Handler = "stateRenderer"; })
.ValueField("stateid")
.DisplayField("state")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
.Store
(
X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)
)
.DataSource(Model[2])


)
)

then state combo will fill but without bellow code

.Proxy(X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(X.JsonReader().Root("data"))

The GetState() function not firing.

so that is my scenario,can you please help

Daniil
Jul 10, 2014, 4:49 PM
I am not getting you.

I am just asking to post the "Index" controller action.

You have set

.DataSource(Model[2])

So, you've probably changed the "Index" controller action with a new Model. I just want to look at that and test on my side.

matrixwebtech
Jul 10, 2014, 4:59 PM
I had posted full controller and view code in my 1st post.you can take this and run for your testing.
Bellow is Index function


public ActionResult Index(string id)
{
List<object> countries = new List<object>(10);
List<object> states = new List<object>(10);
for (int i = 1; i <= 10; i++)
{
countries.Add(new { Text = "C" + i,countryid=i });
}

if (id == "edit")
{

return View(new IEnumerable<object>[]
{
new List<object>
{
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "25",men="58",women="25"},
new {countryid = "1", stateid = "2",state="C1_S1", cityid = "1", population = "65",men="45",women="65"},
new {countryid = "1", stateid = "3",state="C1_S1", cityid = "2", population = "56",men="67",women="89"},
},
countries
});
}
else
{
return View(new IEnumerable<object>[]
{
new List<object>
{

new {countryid = "0", stateid = "0", cityid = "0", population = "0",men="0",women="0"},
},
countries
});
}
}

But I don't want to create a new view for edit.

Daniil
Jul 10, 2014, 6:00 PM
So, if you don't change it, then this

.DataSource(Model[2])
should through an "index is out of range" Exception, because you pass only two items in an IEnumarable<object>[] instance.

matrixwebtech
Jul 10, 2014, 6:25 PM
No I am not getting any error.r u run my code which I pest at my st post.

Daniil
Jul 10, 2014, 6:35 PM
Ok, please repost everything again, I'll try to run it.

matrixwebtech
Jul 10, 2014, 6:47 PM
VIEW CODE


@model System.Collections.IEnumerable[]
@using Ext.Net
@using Ext.Net.MVC
@{
ViewBag.Title = "ComboBox with Template - Ext.NET MVC Examples";

var X = Html.X();
}


<script>

var addPlant = function () {

var r = Ext.create('pr', {
//common: 'New Plant 1',
//light: 'Mostly Shady',
//price: 0,
//availability: Ext.Date.clearTime(new Date()),
//indoor: false


}),
grid = App.GridPanel1;

grid.store.insert(0, r);
grid.editingPlugin.startEditByPosition({ row: 0, column: 0 });
};

var beforeEdit = function (ed, e) {
var field = this.getEditor(e.record, e.column).field;

switch (e.field) {
case "stateid":
field.allQuery = e.record.get('countryid');

break;
case "cityid":
field.allQuery = e.record.get('stateid');
break;



}
};

var countryRenderer = function (value) {
// alert(value)
var r = App.CountryStore.getById(value);

if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
//console.log(r.data.Text)
return r.data.Text;
};
var stateRenderer = function (value) {
var r = App.StateStore.getById(value);
//console.log(r)
if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
console.log(r.data)
return r.data.state;
};
var cityRenderer = function (value) {
var r = App.CityStore.getById(value);
//console.log(r)
if (Ext.isEmpty(r)) {
return "";
}
// alert(r.data.Text)
// console.log(r.data.city)
return r.data.city;
};

</script>


@X.ResourceManager()

@(X.Store()
.ID("CountryStore")
.Model(
X.Model()
.IDProperty("countryid")
.Fields(
X.ModelField()
.Name("Text")
.ServerMapping("Text")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("countryid")
.ServerMapping("countryid")
.Type(ModelFieldType.String)

)
)
.DataSource(Model[0])
)

@(X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)

)
.DataSource(Model[1])

.Proxy(X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(X.JsonReader().Root("data"))
)

)

@(X.Store()
.ID("CityStore")
.Model(X.Model()
.IDProperty("cityid")
.Fields(
X.ModelField()
.Name("cityid")
.Mapping("cityid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("city")
.Mapping("city")
.Type(ModelFieldType.String)
)
)
.Proxy(X.AjaxProxy()
.Url(Url.Action("GetCities"))
.Reader(X.JsonReader().Root("data"))
)
)




@(X.GridPanel()
.ID("GridPanel1")
.TopBarItem(X.Button().Text("Add").Listeners(le => { le.Click.Fn = "addPlant"; }).Icon(Icon.Add)
)
//.Listeners(l =>
// {
// l.ViewReady.Fn = "addPlant";
// l.ViewReady.Delay = 1;
// })
.Frame(true)
.Features(X.Summary())
.Height(300)
.Width(600)
.Title("Grid")
.ForceFit(true)
.Store(X.Store()
.ID("Store1")
.Model(X.Model()
.Name("pr")
.Fields(

X.ModelField()
.Name("countryid")
.Type(ModelFieldType.String),
X.ModelField()
.Name("Text")
.Type(ModelFieldType.String),

X.ModelField()
.Name("stateid")
.ServerMapping("stateid")
.Type(ModelFieldType.String),
X.ModelField()
.Name("state")
.ServerMapping("state")
.Type(ModelFieldType.String),



X.ModelField()
.Name("cityid")

.Type(ModelFieldType.String),
X.ModelField()
.Name("city")

.Type(ModelFieldType.String),

X.ModelField()
.Name("population")

.Type(ModelFieldType.Int),

X.ModelField()
.Name("men")

.Type(ModelFieldType.String),

X.ModelField()
.Name("women")

.Type(ModelFieldType.String)


)
)
.DataSource(Model[2])

)
.View(
Html.X().GridView().MarkDirty(false)
)

.ColumnModel(
X.Column()
.DataIndex("countryid")
.Text("Country")
.Renderer("countryRenderer")

.Editor(X.ComboBox()
.QueryMode(DataLoadMode.Local)
//.TriggerAction(TriggerAction.All)
.StoreID("CountryStore")
.ValueField("countryid")
.DisplayField("Text")
.Listeners(l => { l.Select.Handler = "App.ddlstate.getStore().reload()"; })
),

X.Column()
.DataIndex("stateid")
.Text("State")
.Renderer("stateRenderer")

.Editor(X.ComboBox()
.ID("ddlstate")
.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
.StoreID("StateStore")
.ValueField("stateid")
.DisplayField("state")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
),

X.Column()
.DataIndex("cityid")
.Text("City")
.Renderer("cityRenderer")
.Editor(X.ComboBox()
.ID("ddlcity")
.QueryMode(DataLoadMode.Remote)
.TriggerAction(TriggerAction.All)
.StoreID("CityStore")
.ValueField("cityid")
.DisplayField("city")
.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
),

Html.X().SummaryColumn()
.Width(75)
.Text("Population")
.DataIndex("population")
.SummaryType(SummaryType.Sum)
.Renderer("return value ;")
.SummaryRenderer("return value ;")
.Editor(
Html.X().NumberField().AllowBlank(false).MinValue( 0).StyleSpec("text-align:left")
),

X.Column()
.DataIndex("men")
.Text("Men")
.Editor(X.TextField()
.ID("txtMen")

.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
)
,
X.Column()
.DataIndex("women")
.Text("Wo-Men")
.Editor(X.TextField()
.ID("txtwomen")

.CustomConfig(cc => cc.Add(new ConfigItem { Name = "initQuery", Value = "Ext.emptyFn", Mode = ParameterMode.Raw }))
)
,
Html.X().ImageCommandColumn()
.Width(30)
.Commands(
Html.X().ImageCommand()
.Icon(Icon.Bin)
.ToolTip(t =>
{
t.Text = "Delete plant";

})
.CommandName("delete")
)
.Listeners(l =>
{
l.Command.Handler = "this.up('gridpanel').store.removeAt(recordIndex);";

})




)
.Plugins(X.CellEditing()
.Listeners(events => {
events.BeforeEdit.Fn = "beforeEdit";
})
.ClicksToEdit(1)
.DirectEvents(events =>
{
events.Edit.Action = "Edit";

events.Edit.EventMask.ShowMask = true;
events.Edit.EventMask.CustomTarget = "App.GridPanel1";
events.Edit.ExtraParams.Add(new Parameter { Name = "field", Value = "e.field", Mode = ParameterMode.Raw });
events.Edit.ExtraParams.Add(new Parameter { Name = "index", Value = "e.rowIdx", Mode = ParameterMode.Raw });
events.Edit.ExtraParams.Add(new Parameter { Name = "recordData", Value = "e.record.data", Mode = ParameterMode.Raw });
})
)


)
@(X.Button().Text("Save").Icon(Icon.DatabaseSave).DirectEvents(d =>
{

d.Click.Action = "save";

d.Click.ExtraParams.Add(new Parameter
{
Name = "values",
Value = "Ext.encode(#{GridPanel1}.getRowsValues())",
Mode = ParameterMode.Raw
});


})
)

CONTROLLER CODE


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Ext.Net;
using Ext.Net.MVC;
using System.Text;
namespace ERP_test.Controllers
{
public class masterdetailsController : Controller
{
//
// GET: /masterdetails/

public ActionResult Index(string id)
{
List<object> countries = new List<object>(10);
List<object> states = new List<object>(10);
for (int i = 1; i <= 10; i++)
{
countries.Add(new { Text = "C" + i,countryid=i });
}
for (int i = 1; i <= 10; i++)
{
states.Add(new { state = "S" + i, stateid = i });
}

if (id == "edit")
{

return View(new IEnumerable<object>[]
{
countries,
states,
new List<object>
{
new {countryid = "1", stateid = "1",state="C1_S1", cityid = "1", population = "25",men="58",women="25"},
new {countryid = "1", stateid = "2",state="C1_S1", cityid = "1", population = "65",men="45",women="65"},
new {countryid = "1", stateid = "3",state="C1_S1", cityid = "2", population = "56",men="67",women="89"},
},


});
}
else
{
return View(new IEnumerable<object>[]
{
countries,
states,
new List<object>
{

new {countryid = "0", stateid = "0", cityid = "0", population = "0",men="0",women="0"},
},

});
}
}

public ActionResult GetStates(string query)
{
List<object> states = new List<object>(10);
if (string.IsNullOrEmpty(query) == false)
{
for (int i = 1; i <= 10; i++)
{
states.Add(new { stateid=i,state = query + "_S" + i });
}
}


return this.Store(states);
}

public ActionResult GetCities(string query)
{
List<object> cities = new List<object>(10);
if (string.IsNullOrEmpty(query) == false)
{
for (int i = 1; i <= 10; i++)
{
cities.Add(new { cityid=i,city= query + "_C" + i });
}
}

return this.Store(cities);
}



public ActionResult Edit(string field, string recordData, int index)
{
List<string> fields = new List<string> { "country", "state", "city", "population", "men", "women" };
int startIndex = fields.IndexOf(field);
JsonObject data = JSON.Deserialize<JsonObject>(recordData);
ModelProxy record = X.GetCmp<Store>("Store1").GetAt(index);
Random r = new Random();
switch (field)
{
case "cityid":
record.Set(fields[3], r.Next(10, 200).ToString());
record.Set(fields[4], r.Next(10, 200).ToString());
record.Set(fields[5], r.Next(10, 200).ToString());
break;
}



return this.Direct();
}

public ActionResult save(string values)
{
string json = values;
Dictionary<string, string>[] companies = JSON.Deserialize<Dictionary<string, string>[]>(json);
StringBuilder sb = new StringBuilder();
foreach (Dictionary<string, string> row in companies)
{
foreach (KeyValuePair<string, string> keyValuePair in row)
{
sb.Append(keyValuePair.Key);
}
foreach (KeyValuePair<string, string> keyValuePair in row)
{
sb.Append(keyValuePair.Value);
}
}
return this.Direct();
}

}
}

matrixwebtech
Jul 11, 2014, 4:04 PM
this thread can be close I set my stores like

@(X.Store()
.ID("StateStore")
.Model(X.Model()
.IDProperty("stateid")
.Fields(
X.ModelField()
.Name("stateid")
.Mapping("stateid")
.Type(ModelFieldType.String)
,
X.ModelField()
.Name("state")
.Mapping("state")
.Type(ModelFieldType.String)
)

)
.Data(Model[1])

.Proxy(
X.AjaxProxy()
.Url(Url.Action("GetStates"))
.Reader(
X.JsonReader().Root("data")
)

)

)