I am having a jqgrid and subgrid. And I am using json object to populate data in both grid but only main grid is populating subgrid not be shown. i have attached my code and screen shot with this. please give a solution to me.
advance thanks & regards K. Aravind
<table id="grid"><tr><td></td></tr></table>
<div id="pagerId"></div>
<script type='text/javascript'>
$(window).on('resize.jqGrid', function () {
$("#grid").jqGrid('setGridWidth', $(".page-content").width());
})
var parent_column = $("#grid").closest('[class*="col-"]');
$(document).on('settings.ace.jqGrid', function (ev, event_name, collapsed) {
if (event_name === 'sidebar_collapsed' || event_name === 'main_container_fixed') {
setTimeout(function () {
$("#grid").jqGrid('setGridWidth', parent_column.width());
}, 0);
}
})
var globalSubGridNames = [];
$("#grid").jqGrid({
url: '@Url.Action("MenuGridData")',
datatype: "json",
mtype: 'Get',
height: 200,
colNames: ['menu_key', 'Role Menu Name', 'Role Status'],
colModel: [{
key: true,
name: 'menu_key',
index: 'key',
hidden: true
},
{
key: false,
name: 'Role Menu Name',
index: 'menu name',
formatter: function (cellvalue, options, rowObject) {
var x = '@Html.ActionLink("Col", "Index", "Roles", new { id = "menuid" }, new { @style = "color:black; font-weight:bold;" })';
return x.replace("menuid", rowObject.menu_key).replace("Col", rowObject.menu_name);
}, sortable: true, align: 'left', width: 300
},
{
name: "Status", index: "status", editable: true, edittype: "select", editoptions: { value: "FE:FedEx;IN:InTime;TN:TNT;AR:ARAMEX" }
}
],
pager: 'pagerId',
sortname: 'menu_key',
sortorder: "asc",
viewrecords: true,
rowNum: 20,
rowList: [10, 20, 50, 100],
height: '330px', mtype: 'GET',
emptyrecords: 'No records found',
autowidth: true,
mutiselect: true,
altRows: true,
loadComplete: function () {
var table = this;
setTimeout(function () {
updatePagerIcons(table);
}, 0);
},
jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
userdata: "userdata"
},
subGrid: true,
subGridOptions: {
"plusicon": "ion-plus-round",
"minusicon": "ion-minus-round",
"openicon": "ion-minus-round",
"reloadOnExpand": false,
"selectOnExpand": true
},
subGridRowExpanded: function (subgrid_id, row_id) {
var subgrid_table_id, pager_id; subgrid_table_id = subgrid_id + "_t";
pager_id = "p_" + subgrid_table_id;
$("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' class='scroll'></div>");
alert(subgrid_table_id);
$("#" + subgrid_table_id).jqGrid({
url: '@Url.Action("MenuSubGridData")',
datatype: "json",
mtype: 'POST',
colNames: ['SubMenukey', 'SubMenu'],
colModel: [{ name: "menu_key", index: "menu_key", key: true, hidden: true },
{ name: "menu_name", index: "menu_name", width: 130 },
],
rowNum: 20,
pager: pager_id,
sortname: 'menu_name',
sortorder: "asc", height: '100%',
viewrecords: true,
rowNum: 5,
rowList: [10, 20, 50, 100],
height: '330px',
emptyrecords: 'No records found',
autowidth: true,
altRows: true,
loadComplete: function () {
var table = this;
setTimeout(function () {
updatePagerIcons(table);
}, 0);
},
@* jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
userdata: "userdata"
},*@
});
}
});
public JsonResult MenuSubGridData(int rows, int page, string sidx, string sord)
{
var subgridData = from ladms in db.adm_menus where ladms.menu_parent_key == rows
select new
{
ladms.menu_key,
ladms.menu_name,
};
var count = subgridData.Count();
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = count;
int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
var pagedData = new object();
switch (sidx)
{
case "menu_key":
if (sord.ToLower() == "asc")
{
pagedData = subgridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
}
else
{
pagedData = subgridData.Select(a => new { a.menu_key, a.menu_name }).OrderByDescending(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
}
break;
case "menu_name":
if (sord.ToLower() == "asc")
{
pagedData = subgridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).OrderBy(a => a.menu_name).Skip(pageIndex * pageSize).Take(pageSize);
}
else
{
pagedData = subgridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).OrderByDescending(a => a.menu_name).Skip(pageIndex * pageSize).Take(pageSize);
}
break;
default:
pagedData = subgridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
break;
}
return Json(new
{
page = page,
records = totalRecords,
rows = pagedData,
total = totalPages
}, JsonRequestBehavior.AllowGet);
}
public JsonResult MenuGridData(int rows, int page, string sidx, string sord)
{
var gridData = from lstval in db.adm_menus
where lstval.menu_parent_key==null
select new
{
lstval.menu_key,
lstval.menu_name,
};
var count = gridData.Count();
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = count;
int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
var pagedData = new object();
String s = "menu_name";
switch (sidx)
{
case "menu_key":
if (sord.ToLower() == "asc")
{
pagedData = gridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
}
else
{
pagedData = gridData.Select(a => new { a.menu_key, a.menu_name }).OrderByDescending(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
}
break;
case "menu_name":
if (sord.ToLower() == "asc")
{
pagedData = gridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).OrderBy(a => a.menu_name).Skip(pageIndex * pageSize).Take(pageSize);
}
else
{
pagedData = gridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).OrderByDescending(a => a.menu_name).Skip(pageIndex * pageSize).Take(pageSize);
}
break;
default:
pagedData = gridData.Select(a => new { a.menu_key, a.menu_name }).OrderBy(a => a.menu_key).Skip(pageIndex * pageSize).Take(pageSize);
break;
}
return Json(new
{
page = page,
records = totalRecords,
rows = pagedData,
total = totalPages
}, JsonRequestBehavior.AllowGet);
}