如何使用 loadonce: true 刷新 jqgrid 并返回当前页面

How to refresh jqgrid and go back to the current page using loadonce: true

我正在使用以下设置一次从服务器加载所有数据:

loadonce: true

现在我尝试在编辑后重新加载网格:

// options for the Edit Dialog
{
 closeAfterEdit: true,
 closeOnEscape: true,
 reloadAfterSubmit: true,
 editCaption: "Edit User",
 width: 1140,
 height: 370,
 afterSubmit: function () {
                       $('#jqGrid').jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');
                       return [true,'']; // no error
                   },
 errorTextFormat: function (data) {
                       return 'Error: ' + data.responseText
                                  }
},

数据是从服务器刷新的,但是有一个问题:例如,如果我在第 2 页编辑一条记录,它会在底部的导航栏上显示第 2 页,但它总是从第 2 页调出数据1. 任何帮助将不胜感激。谢谢。

更新#1

我尝试了以下代码:

var $self = $(this), p = $self.jqGrid("getGridParam");
p.datatype = "json";
$self.trigger("reloadGrid", { page: p.page, current: true });

然后我编辑并单击提交,即使导航栏停留在第 2 页,它仍然加载第 1 页数据。然后我单击前进箭头转到第 3 页,然后单击后退箭头再次转到第 2 页现在它显示第 2 页数据。

更新#2

这是我正在做但仍未工作的所有其他相关代码:

...

cmTemplate: { editable: true, editrules: { edithidden: true } },
            pager: "#jqGridPager",
            rowNum: 10,
            rowList: [5, 10, 20, 50],
            sortname: 'lastName, firstName',
            sortorder: 'asc',
            loadonce: true,
            viewrecords: true,
            gridview: true,
            recreateForm: true,
            width: 1140,
            height: "auto",
            multiselect: false,
            altRows: false,
            shrinkToFit: true,
            scroll: false
            }
        });
...

        $('#jqGrid').navGrid('#jqGridPager',
               // the buttons to appear on the toolbar of the grid
               {
                   edit: true,
                   add: true,
                   del: true,
                   search: true,
                   view: true,
                   refresh: true,
                   position: "left",
                   cloneToTop: false,
                   beforeRefresh: function () {
                       //Note: This function is only called after user clicks the refresh button
                       $('#jqGrid').jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');
                   }
               },
               // Options for the Edit Dialog
               {
                   closeAfterEdit: true,
                   closeOnEscape: true,
                   reloadAfterSubmit: false,
                   editCaption: "Edit User",
                   width: 1140,
                   height: 370,
                   afterSubmit: function () {
                       var $self = $(this), p = $self.jqGrid("getGridParam");
                       p.datatype = "json";
                       $self.trigger("reloadGrid", { page: p.page, current: true });
                       return [true, '']; // no error
                   },
                   errorTextFormat: function (data) {
                       return 'Error: ' + data.responseText
                   }
               },
...

最终结果

问题终于解决了!我从 not free Guriddo jqGrid to free jqGrid by Oleg 切换过来,错误消失了!我最初无法让导航按钮出现在免费的 jqgrid 上,但它们没有出现的原因是因为我有标签 iconSet: "fontAwesome" 而我没有引用该字体。当我完全删除该标签时,一切正常。您可以使用该标签,但必须引用图标集 url。就我而言,我不需要不同的图标集。

您可以使用 reloadGridpage 选项(相应的演示见 the answer)。您可以使用 $(this).jqGrid("getGridParam", "page") 获取 page 参数,该参数包含 当前 页面。

afterSubmit: function () {
    var $self = $(this), p = $self.jqGrid("getGridParam");
    p.datatype = "json";
    $self.trigger("reloadGrid", { page: p.page, current: true });
    return [true]; // no error
}

我使用 reloadGridcurrent: true 选项到 select 重新加载网格后当前 selected 行。