[Index.cshtml]
<B>Master Grid</B>
@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.dataSource).Width("auto").SelectedRowIndex(0).Columns(col =>
{
col.Field("EmployeeID").HeaderText("EmployeeID").IsPrimaryKey(true).Add();
...
}).RowSelected("selected").Render()
<B>Detail Grid</B>
@Html.EJS().Grid("Grid1").DataSource((IEnumerable<object>)ViewBag.dataSource2).Columns(col =>
{
col.Field("EmployeeID").HeaderText("EmployeeID").IsPrimaryKey(true).Add();
...
}).Render()
<script>
function selected(args) {
var data = @Html.Raw(Json.Encode(ViewBag.dataSource2))
var employeeID = args.data.EmployeeID;
var detaildata = new ej.data.DataManager(data).executeLocal(new ej.data.Query().where("EmployeeID", "equal", employeeID, false).take(10));
var grid = document.getElementById("Grid1").ej2_instances[0]; //Get the instance for the detail Grid
grid.dataSource = new ej.data.DataManager(detaildata.slice(0, 5)).dataSource.json; //Set datasource for detail grid
}
</script> |
@Html.EJS().Grid("Grid").AllowPaging().DataSource(dataManager => {dataManager.Url("/Home/UrlDatasource").Adaptor("UrlAdaptor");}).Width("auto").SelectedRowIndex(0).Columns(col =>
{
col.Field("EmployeeID").HeaderText("EmployeeID").IsPrimaryKey(true).Add();
. . . .
}).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel", "Search" }).RowSelected("selected").Render()
|
public ActionResult UrlDatasource(DataManagerRequest dm)
{
var DataSource = OrdersDetails.GetAllRecords().ToList();
int count = OrdersDetails.GetAllRecords().Count();
var data = DataSource.Skip(dm.Skip).Take(dm.Take).ToList();
return dm.RequiresCounts ? Json(new { result = data, count = count }) : Json(data);
}
|