1

我是 jQgrid 的初学者，最近几天我尝试学习 jQgrid 并创建一个示例

Mvc 应用程序。参考 jQgrid 网站。http://www.trirand.com/blog/jqgrid/jqgrid.html

我尝试在 jQGrid 中将网格设置为子网格。我想要添加、编辑、删除所有功能

子网格是可能的。

当我在 jQgrid 中展开一行时，我遇到了一个问题，父行没有显示

折叠图标。请看我下面的图片。

在此处输入图像描述

请看红框。它没有显示减号图标。请在下面查看我的代码。

  <table id="listsg11">
</table>
<div id="pagersg11">
</div>
<script type="text/javascript">
    jQuery("#listsg11").jqGrid({
        url: '/Home/DynamicGridData/',
        datatype: "json",
        mtype: 'POST',
        height: 190,
        width: 600,
        colNames: ['Id', 'Votes', 'Title'],
        colModel:
        [
            { name: 'Id', index: 'Id', width: 40, align: 'left' },
            { name: 'Votes', index: 'Votes', width: 40, align: 'left' },
            { name: 'Title', index: 'Title', width: 400, align: 'left' }
        ],
        rowNum: 8,
        rowList: [8, 10, 20, 30],
        pager: '#pagersg11',
        sortname: 'id',
        viewrecords: true,
        sortorder: "desc",
        multiselect: false,
        subGrid: true,
        caption: "Grid as Subgrid"
        ,
        subGridRowExpanded: function (subgrid_id, row_id) {
            // we pass two parameters 
            // subgrid_id is a id of the div tag created whitin a table data 
            // the id of this elemenet is a combination of the "sg_" + id of the row 
            // the row_id is the id of the row 
            // If we wan to pass additinal parameters to the url we can use 
            // a method getRowData(row_id) - which returns associative array in type name-value 
            // here we can easy construct the flowing
            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>");
            jQuery("#" + subgrid_table_id).jqGrid({
                url: "/Home/DynamicGridData1/",
                datatype: "json",
                mtype: 'POST',
                colNames: ['Id', 'Votes', 'Title'],
                colModel:
                [
                    { name: 'Id', index: 'Id', width: 40, align: 'left' },
                    { name: 'Votes', index: 'Votes', width: 40, align: 'left' },
                    { name: 'Title', index: 'Title', width: 400, align: 'left' }
                ],
                rowNum: 20,
                rowList: [8, 10, 20, 30],
                pager: pager_id,
                sortname: 'Id',
                sortorder: "asc",
                height: 180,
                width: 500,
            });
            jQuery("#" + subgrid_table_id).jqGrid('navGrid', "#" + pager_id, { edit: true, add: true, del: true })
        }
        //,
        //            subGridRowColapsed: function (subgrid_id, row_id) {
        //                alert(row_id);
        //                // this function is called before removing the data 
        //                //var subgrid_table_id; 
        //                //subgrid_table_id = subgrid_id+"_t"; 
        //                //jQuery("#"+subgrid_table_id).remove();
        //            }
    });
    jQuery("#listsg11").jqGrid('navGrid', '#pagersg11', { add: true, edit: true, del: true });

</script>

请帮忙。

4

1 回答 1

2

为什么你不尝试把 javascript 放在里面

$(function(){
//here go the script
});

因为其中一个原因是 jqgrid 尚未正确下载。

所以试试这个！

祝你好运！

于 2013-01-30T05:12:00.763 回答