Aug 17, 2014, 2:58 PM
Custom Window with Record Details on MVC
Hi, I am migrating the following webform example to mvc
https://examples2.ext.net/#/GridPane...etails_Window/
This is my view code
https://examples2.ext.net/#/GridPane...etails_Window/
This is my view code
@{
Layout = null;
@Html.X().ResourceManager()
}
@{
<script>
var CompanyX = {
_index: 0,
getIndex: function () {
return this._index;
},
setIndex: function (index) {
if (index > -1 && index < App.GridPanel1.getStore().getCount()) {
this._index = index;
}
},
getRecord: function () {
var rec = App.GridPanel1.getStore().getAt(this.getIndex()); // Get the Record
if (rec != null) {
return rec;
}
},
edit: function (index) {
this.setIndex(index);
this.open();
},
next: function () {
this.edit(this.getIndex() + 1);
},
previous: function () {
this.edit(this.getIndex() - 1);
},
refresh: function () {
App.GridPanel1.getView().refresh();
}
};
</script>
}
@(Html.X().GridPanel()
.ID("GridPanel1")
.Title("Employees")
.Height(200)
.Store(Html.X().Store()
.PageSize(5)
.Proxy(proxy =>
proxy.Add(Html.X().AjaxProxy()
.Url("Employees")
.ActionMethods(methods =>
methods.Read = HttpMethod.POST
)
.Reader(Html.X().JsonReader()
.TotalProperty("total")
.Root("data")
)
.Listeners(l => l.Exception.Handler = "Ext.MessageBox.alert('Load failed', response.statusText);")
)
)
.Model(Html.X().Model()
.IDProperty("EmployeeID")
.Fields(
new ModelField("EmployeeID"),
new ModelField("FirstName"),
new ModelField("LastName"),
new ModelField("Title"),
new ModelField("TitleOfCourtesy"),
new ModelField("BirthDate", ModelFieldType.Date),
new ModelField("HireDate", ModelFieldType.Date),
new ModelField("City"),
new ModelField("Address"),
new ModelField("Region"),
new ModelField("PostalCode"),
new ModelField("Country"),
new ModelField("Homephone"),
new ModelField("Extension"),
new ModelField("Notes"),
new ModelField("Photopath"),
new ModelField("ReportsTo")
)
)
.Sorters(Html.X().DataSorter()
.Property("LastName")
.Direction(Ext.Net.SortDirection.ASC)
)
)
.ColumnModel(
Html.X().Column().Text("Full Name").DataIndex("LastName").Flex(1).Renderer(new Renderer() { Fn = "return '<b>' + record.data['LastName'] + '</b>,' + record.data['FirstName']" }),
Html.X().Column().Text("Title").DataIndex("Title").Width(150),
Html.X().DateColumn().Text("Birth Date").DataIndex("BirthDate").Format("yyyy-MM-dd"),
Html.X().Column().Text("City").DataIndex("City").Width(100),
Html.X().Column().Text("Address").DataIndex("Address").Width(250),
Html.X().CommandColumn()
.Commands(c =>
{
c.Add(Html.X().GridCommand().CommandName("Edit").Icon(Icon.NoteEdit));
})
.ToolTip("Edit")
.Listeners(listener =>
{
listener.Command.Handler = "CompanyX.edit(recordIndex);";
})
)
.BottomBar(
Html.X().PagingToolbar()
.DisplayInfo(true)
.DisplayMsg("Displaying employees {0} - {1} of {2}")
.EmptyMsg("No employees to display")
)
)
But I don't know how to return json data from controller public ActionResult Index()
{
List<Employee> result = Employee.GetAll();
return this.Store(result);
}
Could you help me or give me some example? Thanks