显示带有列标题的空白 JQGrid

Question

我想在页面加载时显示带有所有列标题但没有任何数据行的 JQGrid。

根据用户通过自动完成进行的选择，我想用数据填充 JqGrid。

问题是每次在页面加载期间都会自动填充网格。

我该如何解决这个问题？

这就是我在 VS2008 MVC2 中使用网格的方式

jQuery('#jgrid').jqGrid({
    autowidth: true,
    altRows: true,
    altclass: 'grdAltRwClr',
    datatype: 'xml',
    forceFit: true,
    gridview: true,
    height: 290,
    mtype: 'post',
    rowList: [10, 20, 30],
    rowNum: 10,
    pager: '#pager',
    pagerpos: 'right',
    recordpos: 'left',
    rownumbers: false,
    scrollrows: false,
    sortname: 'roledtlid',
    toolbar: [true, "top"],
    url: rootPath + 'RoleDetail/JGridData',
    beforeSelectRow: function(rowid, e) { return false; },
    gridComplete: function() { GridComplete() },
    colModel: [
          { name: 'act', label: 'View', resizable: false, search: false, sortable: false, title: false, width: 6, index: 'act' }
        , { name: 'roledtlid', label: 'R.Detail id', width: 15, index: 'roledtlid' }
        , { name: 'roleid', label: 'Role id', width: 10, index: 'roleid' }
        , { name: 'rolename', label: 'Role Name', width: 25, index: 'rolename' }
        , { name: 'pageid', label: 'Page ID', width: 10, index: 'pageid' }
        , { name: 'pgname', label: 'Page Name', width: 30, index: 'pgname' }
        , { name: 'canadd', label: 'Add', width: 10, index: 'canadd' }
        , { name: 'canedit', label: 'Edit', width: 10, index: 'canedit' }
        , { name: 'candel', label: 'Delete', width: 10, index: 'candel' }
        , { name: 'canview', label: 'View', width: 10, index: 'canview' }
         ]
});

谢谢

Answer 1

不要提供网址。而是将您的数据类型设置为“本地”并使用类似于以下的代码：

    var mySearchData = // Get your search data...

    $.post('@Url.Action("Getars")', mySearchData, function(gridData) {
        var rowIds = $('#carGrid').jqGrid('getDataIDs');

        for (var i = 0, len = rowIds.length; i < len; i++) {
            var currRow = rowIds[i];
            $('#carGrid').jqGrid('delRowData', currRow);
        }

        $('#carGrid').jqGrid('setGridParam', { data: gridData }).trigger('reloadGrid');
    }).error(function (jqXHR, textStatus) {
        app.showErrorAlert(jqXHR.responseText);
    });
}