javascript - jqgrid 4.6 工具栏在 loadonce 设置为 true 时无法工作

Question

我正在尝试使用 jqgrid v4.6 实现工具栏过滤，但无法过滤结果

   $('form[name="viewComplaintsForm"] button').click(function(e){
         e.preventDefault();
         var viewForm=$(this).parent('form');
         complaintDeptId=viewForm.find('select option:selected').val();
         complaintDeptName=viewForm.find('select option:selected').text();
         if(complaintDeptId !=0){
         var reqData={"complaintDeptId":complaintDeptId};
         if (complaintList.is(':empty')){
             complaintList.jqGrid({
                    url: "./getComplaintDetails",
                    datatype: "json",
                    mtype: "POST",
                    ajaxGridOptions: { contentType: 'application/json' },
                    postData:JSON.stringify(reqData),
                    colNames: ['ComplaintId',"ComplaintText", ""+complaintDeptName+"", "Status",'ComplaintAdded','ComplaintUpdated','userId'],
                    colModel: [
                        { name: "complaintId",hidden:true},
                        { name: "complaintText", width:700},
                        { name: "deptName", width:100},
                        { name: "comstatus", width:100 },
                        { name: "comAdded", width:200 },
                        { name: "comUpdated", width:200 },
                        { name: "userId",hidden:true },
                    ],
                    pager: "#pager",
                    rownumbers:true,
                    rowNum: 5,
                    rowList: [5, 10, 20],
                    viewsortcols:[true,'vertical',true],
                    viewrecords: true,
                    gridview: true,
                    caption: "Complaints grid",
                    loadonce:true,
                    autowidth:true,
                    shrinkToFit:true,
                    ignoreCase: true,
                    height:'auto',
                    jsonReader: {
                        repeatitems: false,
                        id: "complaintId",
                        root: function (obj) { return obj; },
                        page: function (obj) { return 1; },
                        total: function (obj) { return 1; },
                        records: function (obj) { return obj.length; }
                    },  
                     loadComplete:function(response){   
                    /*
                     if (this.p.datatype === 'json') {
                         console.log('inside');
                         setTimeout(function() {
                             console.log('inside');
                             $("#list")[0].triggerToolbar(); 
                         }, 100);
                     }*/
                    complaintList.navGrid('#pager',{add:false,edit:false,refresh:true,del:false,
                        view:true,search:true});
                 complaintList.jqGrid('filterToolbar',{searchOnEnter:false,stringResult:true,defaultSearch: "cn"});
                },
     });

     }
     else{
         complaintList.jqGrid('setGridParam',{postData:JSON.stringify(reqData),datatype:'json'}).trigger("reloadGrid");
         complaintList.jqGrid('setLabel','deptName',complaintDeptName);
     }

这里的complainList是网格。我从类型为 JSON 的服务器获取数据，并使用 loadonce: true 属性转换为本地类型。我想启用客户端工具栏过滤

编辑以将 navgrid 和 toolbar 的初始化放入 loadcomplete 中，因为网格根据参数的值一次又一次地初始化投诉部门Id

Answer 1

如果我正确理解您的问题，那么您应该替换参数

postData:JSON.stringify(reqData)

到下面的回调函数

serializeGridData: function (postData) {
    return JSON.stringify(reqData);
}

它将替换标准数据，该数据将使用您的自定义字符串 JSON.stringify(reqData) 发送到服务器。另一方面，标准参数 postData 将保留 object。

您也应该从 setGridParam 的参数中删除 postData:JSON.stringify(reqData) 。 serializeGridData 将自动使用 reqData 的值。