Question

我在我的ASP.NET MVC视图页面上使用JQGrid。我正在进行客户端更新，排序，分页，我正在客户端和服务器端进行删除操作（基于某些条件）。

注意：我的JQGrid版本是：4.6.0

我的问题是当我更新或删除任何记录时，在此之后进行分页或排序操作，我的网格显示初始JSON数据意味着第一次加载网格的数据。

$("#myGrid").jqGrid({
    url: "Product/List",
    datatype: "json",
    mtype: "GET",
    colNames: ['Id', 'Name', 'Category'],
    colModel: [
        { name: 'Id', index: 'Id', width: 20, key: false, sorttype: 'int' },
        { name: 'Name', index: 'Name', key: true },
        { name: 'Category', index: 'Category',  key: false },
        { name: 'Action', index: 'Action', key: false, sortable: false, formatter: DisplayActionButtons, width: 20 }],
    height: 'auto',
    jsonReader: {
        //root: 'rows',
        //page: 'page',
        total: 'total',
        //records: "records",
        repeatitems: false,
        id: 'ID'
    },
    ignoreCase: true,
    sortname: 'Name',
    loadComplete: function () {                                                                                                                        
        var cnt = $("#myGrid").jqGrid('getGridParam', 'records');
        var emptymessageDiv = $('#dvMessage');

        if (emptymessageDiv.length == 0) {
            $("<div id='dvMessage'> <span class='clsEmptyRow'></span></div>")
                .insertBefore("#myGrid");
        }

        if (cnt == 0 && emptymessageDiv.length == 0) {
            $("#dvMessage .clsEmptyRow").text('No Record Found');
        }
    },
    autowidth: true,
    multiselect: false,
    pager: "#divPager",
    rowNum: 5,
    select: false,
    loadonce: true,
    sortorder: "asc"
});

这是我更新记录的jquery -

$("#myGrid").jqGrid('setCell', rowId, columnName, NewValue);

以下是删除记录的jquery： -

$('#myGrid').jqGrid('delRowData', rowid);

以下是删除记录前的屏幕截图 -

enter image description here

以下是删除所有网格行后的屏幕截图： -

enter image description here

屏幕截图网格显示，在分页，排序，更新或删除后，不会更新值/行数据。

注意：第二个屏幕截图显示＆＃34;未找到记录。＆＃34;一旦我对网格进行排序或在网格上进行分页，就会显示包含初始行的消息。

Answer 1

您使用的loadComplete回调代码必须更改。

首先，您应该创建并添加"<div id='dvMessage'> <span class='clsEmptyRow'></span></div>" 一次，而不是在loadComplete的每次执行时附加相同的div。因此，您应该从loadComplete移动相应的代码片段，并在创建网格后直接将其放置。在loadComplete内，您只需显示/隐藏div：

$("#myGrid").jqGrid({ ... loadComplete: function () { // call $("#dvMessage").show() or $("#dvMessage").hide() // depend on the number of records in the grid $("#dvMessage")[$(this).jqGrid("getGridParam", "records") > 0 ? "hide" : "show"](); }, onInitGrid: function () { $(this).before("<div id='dvMessage'><span class='clsEmptyRow'>No Record Found</span></div>") } });

您可以考虑使用reccount代替records。最佳选择取决于您的确切要求。

jqgrid行更新数据在客户端排序时清除

1 个答案: