|
Index.cshtml
<body>
@(Html.EJ().Grid<EmployeeView>("MasterGrid")
.Datasource((IEnumerable<object>)ViewBag.datasource1)
.IsResponsive()
.SelectedRowIndex(0)
.Columns(col =>
{
col.Field("EmployeeID").HeaderText("Employee ID").IsPrimaryKey(true).TextAlign(TextAlign.Right).Width(100).Add();
col.Field("FirstName").HeaderText("First Name").Width(100).Add();
col.Field("LastName").HeaderText("Last Name").Width(100).Priority(2).Add();
col.Field("Title").HeaderText("Title").Width(90).Priority(3).Add();
col.Field("BirthDate").HeaderText("Birth Date").TextAlign(TextAlign.Right).Width(100).Format("{0:MM/dd/yyyy}").Priority(5).Add();
col.Field("Country").Width(100).HeaderText("Country").Priority(4).Add();
})
.ClientSideEvents(eve => { eve.RowSelected("rowSelected"); })
)
</body>
<script type="text/javascript">
$(function () {
window.rowSelected = function (args) {
var employeeID = args.data.EmployeeID;
$.ajax
({
url: "/Home/EditPartial?OrderID=" + EmployeeID,
type: 'GET',
success: function (data) {
$("#MasterGrid ").html(data); }
});
}
});
</script>
@Html.EJ().ScriptManager() @*To render Syncfusion controls in partialview*@
Controller.cs
[HttpGet]
public ActionResult EditPartial()
{
var DataSource = OrderRepository.GetAllRecords();
var id = 0;
Dictionary<string, string>dictionary = new Dictionary<string, string>();
if (Request.QueryString["EmployeeID"] != null)
var detaildata = ej.DataManager(window.gridData).executeLocal(ej.Query().where("EmployeeID", ej.FilterOperators.equal, employeeID, false).take(10));
var gridObj = $("#DetailGrid").ejGrid("instance");
var data= gridObj.dataSource(ej.DataManager(detaildata.slice(0, 5)));
ViewBag.datasource = data;
return PartialView("_PartialPage1", data);
} | 
