MVC jqgrid subgrid not showing up?

See more:

MVC

jQuery

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'>
    //resize to fit page size
    $(window).on('resize.jqGrid', function () {
        $("#grid").jqGrid('setGridWidth', $(".page-content").width());
    })
    //resize on sidebar collapse/expand
    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 is for webkit only to give time for DOM changes and then redraw!!!
            setTimeout(function () {
                $("#grid").jqGrid('setGridWidth', parent_column.width());
            }, 0);
        }
    })
    // var data = [[48803, "DSK1", "", "02200220", "OPEN"], [48769, "APPR", "", "77733337", "ENTERED"]];
    // var subgridData = [[1, "Item 1", 3], [2, "Item 2", 5]];
    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"
                },*@
            });

        }
    });

// CONTROLLER FILE


  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,
                               //lstval.inactive,
                               //lstval.list_value_code,
                               //list_key = lst.list_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();
            //String s = "menu_name";
            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;
                //case "list_value_code":
                //    if (sord.ToLower() == "asc")
                //    {
                //        pagedData = gridData.Select(a => new { a.list_value_key, a.list_key, a.inactive, a.list_value_name, a.list_value_code }).OrderBy(a => a.list_value_code).Skip(pageIndex * pageSize).Take(pageSize);
                //    }
                //    else
                //    {
                //        pagedData = gridData.Select(a => new { a.list_value_key, a.list_key, a.inactive, a.list_value_name, a.list_value_code }).OrderByDescending(a => a.list_value_code).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
                          // join lst in db.mas_lists on lstval.list_key equals lst.list_key
                          where lstval.menu_parent_key==null
                           select new
                           {
                               lstval.menu_key,
                               lstval.menu_name,
                               //lstval.inactive,
                               //lstval.list_value_code,
                               //list_key = lst.list_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;
                //case "list_value_code":
                //    if (sord.ToLower() == "asc")
                //    {
                //        pagedData = gridData.Select(a => new { a.list_value_key, a.list_key, a.inactive, a.list_value_name, a.list_value_code }).OrderBy(a => a.list_value_code).Skip(pageIndex * pageSize).Take(pageSize);
                //    }
                //    else
                //    {
                //        pagedData = gridData.Select(a => new { a.list_value_key, a.list_key, a.inactive, a.list_value_name, a.list_value_code }).OrderByDescending(a => a.list_value_code).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);
        }