jqGrid 尝试在网格创建上应用过滤器

Question

我有一个包含以下过滤字符串的对象：

prefs.filters={"groupOp":"AND","rules":[{"field":"FirstName","op":"cn","data":"max"}]}

这是我创建的网格，我试图在其中应用 postData 设置中的过滤器：

        // Set up the jquery grid
        $("#jqGridTable").jqGrid(
            {
                // Ajax related configurations
                url: jqDataUrl,
                datatype: "json",
                mtype: "GET",
                autowidth: true,

                // Configure the columns
                colModel: columnModels,

                // Grid total width and height
                height: "100%",

                // customize jqgrid post init
                gridComplete: function()
                {
                    CRef.updateJqGridPagerIcons("jqGridTable");
                },

                // Paging
                toppager: true,
                rowNum: 20,
                rowList: [5, 10, 20, 50, 100],
                viewrecords: true, // Specify if "total number of records" is displayed

                // Default sorting
                sortname: typeof prefs.sortCol !== "undefined" ? prefs.sortCol : "LastName",
                sortorder: typeof prefs.sortCol !== "undefined" ? prefs.sortOrd :  "asc",
                sorttype: "text",
                sortable: true,

                postData: typeof prefs.filters !== "undefined" ? { filters: prefs.filters } : {},
                //also tried this...
                //postData: typeof prefs.filters !== "undefined" ? { JSON.stringify(filters: prefs.filters) } : {},

 //remaining property settings excluded from post to keep short.

更新：在网格上使用 .navGrid 如下：

.navGrid("#jqGridTable",
                { refresh: true, add: false, edit: false, del: false, refreshtitle: getRefreshText('@Model.Instruction'), searchtitle: searchText },
                {}, // settings for edit
                {}, // settings for add
                {}, // settings for delete
                { closeAfterSearch: true, closeOnEscape: true, multipleSearch: true, multipleGroup: true });

创建网格时，未应用postData 中的过滤器。我还尝试在初始创建后触发重新加载事件，但也没有应用过滤器。

从其他帖子来看，我相信我走的路是正确的，但似乎遗漏了一些东西。

评论后更新：

我将以下代码添加到 loadComplete...

if ($("#jqGridTable").jqGrid("getGridParam", "datatype") === "json") {
    setTimeout(function () {

        $("#jqGridTable").jqGrid("setGridParam", {
            datatype: "local",
            postData: { filters: prefs.filters, sord: prefs.sortOrd, sidx: prefs.sortCol },
            search: true
        });

        $("#jqGridTable").trigger("reloadGrid");
    }, 50);
}

并且它成功地保留了过滤器。 :)

但是，现在我遇到了有趣的问题副作用。我可以对列进行排序，并且某些列将更改为正确排序 asc/desc，但是当我转到其他列进行排序时，它们会按照最初加载的顺序进行排序，既不是 asc 也不是 desc。

Answer 1

如果您希望应用 filters，则必须设置 jqGrid 的 search: true 选项。此外，您使用 datatype: "json"。这意味着 filters 将只发送到服务器，您的服务器代码必须解码过滤器并在那里使用。再多说一句。 postData 的正确值为 { filters: JSON.stringify(prefs.filters) }.

更新： 我建议您升级到最新版本 (4.12.1) 或 free jqGrid. It's the fork of jGrid which I develop since the end of 2014. To use free jqGrid you can just change the URLs to jqGrid files to URLs described in the wiki article。之后您可以使用以下选项：

loadonce: true,
forceClientSorting: true,
search: true,
postData: { filters: prefs.filters },
sortname: prefs.sortCol,
sortorder: prefs.sortOrd

和删除您在问题的 "Update after comments" 部分发布的 loadComplete 代码。免费的 jqGrid 将加载从服务器返回的所有数据，应用过滤器 prefs.filters locally，将结果排序 locally 并显示第一页结果（基于页面大小 rowNum: 20）。

The old demo loads the JSON data从服务端，本地排序数据，然后按isFinal === 1过滤，最后显示第一页结果。该演示使用 sortfunc、additionalProperties 额外自定义排序，允许在本地 data.

中保存额外的属性

您可以将 reloadGridOptions: { fromServer: true } 添加到您使用的 navGrid 的其他选项中 (refresh: true, add: false, ...)。如果用户单击该按钮，它将更改导航栏的刷新按钮的行为以从服务器重新加载数据。有关免费 jqGrid 和 loadonce: true.

新选项的更多信息，请参阅我今天发布的

jqGrid 尝试在网格创建上应用过滤器

jqGrid Trying to apply filter(s) on Grid creation

filter

jqgrid