Question

我有一个JSON对象如下：

{
  "rows": [
  {
    "id":1,
    "name": "Peter",
    "hasData": true,
  },
  {
    "id":2,
    "name": "Tom",
    "hasData": false,
  }]
}

我希望jqGrid只加载包含数据的行，这意味着"hasData" == true。

我首先想知道最好的方法是什么，其次是想知道怎么做。

更新：我尝试过以下方法：

gridComplete: function(){
  var rowObjects = this.p.data;
    for(var i = 0; i<rowObjects.length;i++){
      if(rowObjects[i].hasData == false){
        $(this).jqGrid('delRowData',rowObjects[i].id);
      }
    }
  },

但问题是当我转到下一页时，所有数据都是从JSON加载的。

Answer 1

我认为您使用datatype: "json"结合loadonce: true选项从服务器加载数据。如果使用jqGrid的free jqGrid fork，解决方案非常简单。免费的jqGrid允许在显示第一页数据之前对从服务器返回的数据进行排序和过滤。需要添加forceClientSorting: true以强制jqGrid和postData.filters应用您需要的过滤器，并使用选项search: true来应用过滤器：

$("#grid").jqGrid({ ... datatype: "json", postData: { // the filters property is the filter, which need be applied // to the data loaded from the server filters: JSON.stringify({ groupOp: "AND", groups: [], rules: [{field: "hasData", op: "eq", data: "true"}] }) }, loadonce: true, forceClientSorting: true, search: true, // to be able to use "hasData" property in the filter one has to // include "hasData" column in colModel or in additionalProperties additionalProperties: ["hasData"], ... });

请参阅演示https://jsfiddle.net/OlegKi/epcz4ptq/，演示它。该演示使用JSFiddle的Echo service来模拟服务器响应。

Answer 2

我可以向您推荐另一种解决方案（如果您使用Guriddo jqGrid），它可以与任何数据类型和任何设置一起使用。我们的想法是使用beforeProcessing事件来过滤所需的数据。

为此，我们假设数据就像您描述的那样。这是代码：

$("#grid").jqGrid({
...
        beforeProcessing : function (data, st, xhr) {

            var test= data.rows.filter(function (row) {
                if(row.hasData == true ) { // true is not needed but for demo
                    return true;
                } else {
                    return false;
                }
            });
            data.rows = test;
            return true;
        }
...
});

我想这个脚本可以在免费的jqGrid中使用，以防你使用它们

jqGrid：如何仅加载属性设置为true的行

2 个答案: