javascript - 如何过滤 jqGrid 数据而不是网格本身

Question

据我所知，free-jqgrid使用 jlinq过滤和搜索数据。我正在制作自己的过滤器，它们使用众所周知的格式的网格 postData:

{ "groupOp": "AND",
      "groups" : [
        { "groupOp": "OR",
            "rules": [
                { "field": "name", "op": "eq", "data": "England" },
                { "field": "id", "op": "le", "data": "5"}
             ]
        }
      ],
      "rules": [
        { "field": "name", "op": "eq", "data": "Romania" },
        { "field": "id", "op": "le", "data": "1"}
      ]
}

此数据在内部转换为 jlinq 查询。是否有任何公共(public)函数来获取当前对 grid 的查询？我还看到有一种私有(private)的可能性以类似 sql 的格式获取它。

我想尽可能多地使用默认的 jqGrid 功能，但没有找到任何东西。任何提示表示赞赏。

更新 2:

来了fiddle目前的实现。我需要采用它，所以那里有一些丑陋的部分，但你可以过滤值(value)观，以了解这个想法。首先，玩一下网格，因为代码很糟糕(这就是我想要更改它的原因，真的:))

所以，主要思想:

1. 我们将过滤器值修改为众所周知的规则和组。

2. 我们遍历所有列，删除该列名称的 rules 和 groups 并过滤数据。我的问题部分来了:我需要过滤数据，而不是网格，只需要一个数据来获得唯一值。现在，我从 postData 生成一个正则表达式，并通过纯 javascript 生成子集网格数据。您可以在 getDistinctColumnValues 中看到这一点，我想使用一些网格过滤的可能性 以使其工作方式与所有 opts 工作方式相同，当我们使用 postData 集进行过滤/搜索。

此外，我还看到一些内部函数可以将过滤器作为 sql - 其中 - 这对于后端原型(prototype)设计也很好。

Answer 1

抱歉，我不确定您需要实现什么。你可以获得lastSelectedData参数以根据当前过滤器获得过滤和排序数据的数组。完整数据可通过 lastSelectedData 获得范围。 filters postData的属性(property)参数为您提供当前过滤器。

您问“是否有任何公共(public)函数可以获取当前对网格的查询？”。您可以使用 getGridParam获取当前查询的方法。我想，您想访问一些接近 jlinq 的内部结构，但它实际上没有任何实用值(value)。您可以通过 $.jgrid.from 访问类(class)，但这并不是很有帮助。实用的只需要在postData.filters中设置新的过滤器即可参数，设置search参数 true并调用.trigger("reloadGrid")用新数据重新加载网格。

如果您需要自己过滤或排序一些数据，那么数组方法filter和 sort会更有效。如果以上信息不能帮助您解决问题，请在您的问题后附上附加信息，这些信息在示例中更详细地描述了问题并发表小评论。

已更新:我仍然不确定我是否完全理解您想要实现的内容。在我看来，如果您使用一些免费的 jqGrid 选项，您的 JSFiddle 演示的大部分功能都可以删除。

看https://jsfiddle.net/OlegKi/wqxyo579/25/ , 它使用了

colModel: [
    { name: 'name' },
    { name: 'surname' },
    { name: 'age' },
],
cmTemplate: {
    width: 100,
    autoResizable: true,
    stype: 'select',
    searchoptions: {
        generateValue: true,
        noFilterText: "(All)"
    }
},

它在每一列上设置了一些默认属性。从 4.14.0 版开始，免费的 jqGrid 支持 generateValue: true searchoptions的属性(property)对于具有 stype: 'select' 的列(参见 here)。在内部，它的工作方式类似于 colModel 的另一个选项: createColumnIndex: true , 它根据具有 createColumnIndex: true 的所有列中的唯一值生成映射.可以使用 getUniqueValueFromColumnIndex方法来获取任何列的索引(如 var indexName = $("#list").jqGrid("getUniqueValueFromColumnIndex", "name"); )。如果使用 stype: 'select', searchoptions: { generateValue: true } , 然后 filterToolbar自动构建 <select>使用索引的元素。 jqGrid 内部使用 oSv = $("#list")[0].generateValueFromColumnIndex(cmName, sep, delim); (参见 here)。因此，使用该功能可以节省大量自定义设置。

唯一的一点，在使用 createColumnIndex: true 时不要忘记这一点。或 generateValue: true : 索引将在加载或重新加载数据后构建。所以应该调用filterToolbar 之后 填充数据。如果您从服务器加载关于 loadonce: true 的数据选项，那么你应该调用filterToolbar更好的内部 loadCompleted回调(就像在演示中一样)。如果直接加载本地数据，则不需要。只需调用 filterToolbar 在填充数据之后。

另一种选择是使用 <datalist>而不是 <select> .它允许使用 <input>在过滤器工具栏中，但具有接近选择或选择 2 的功能。参见 https://jsfiddle.net/OlegKi/wqxyo579/24/ ，我在哪里使用 createColumnIndex: true, searchoptions: { sopt: [ "cn", "eq", "bw", "ew", "bn", "nc", "en" ], clearSearch: true, generateDatalist: true } .数据列表在不同的网络浏览器中以略有不同的方式实现，它们有一些缺点，但它是 native 实现的功能，因此运行速度非常快。可以将它用于例如网格中的 1000 个唯一值和 10000 行(我强烈建议在这种情况下使用本地数据分页并使用页面大小 10-25)。具有 1000 个元素的数据列表仍然具有良好的性能，例如 select2 更好。

最后的评论。我看到你 build 了colModelIndexesByNames按名称查找列。内置参数iColByName已经存在于免费的 jqGrid 中并在内部使用。如果p是对 jqGrid ( var p = $("#list").jqGrid("getGridParam") ) 参数的引用，然后是 p.iColByName是 map ，它通过列名和 p.colModel[p.iColByName.name] 获取列索引将代表 colModel 中的项目, 对应 "name"专栏。