如何在页面重新加载时保留 jqGrid 中的搜索过滤器?

IT技术 javascript jquery jqgrid
2021-02-19 20:52:28

我发现了许多接近我需要的讨论,这个问题是最接近的 -如何在 jqGrid 的请求中将 postData._search 设置为 true?.

由于我正在为几乎相同的问题而苦苦挣扎,并且无法使其正常工作 - 我想在 jqGrid 的初始加载期间设置“搜索”和“过滤器” - 例如,在页面重新加载时,我有我的存储在会话中的过滤器 - 我尝试了我在 Oleg 示例中找到的所有内容 - 它不起作用!

这就是我正在尝试做的-

loadBeforeSend: function (xhr) {
    var grid = jQuery('#' + block_id);
    var postData = grid.jqGrid('getGridParam','postData');
    jQuery.extend(postData,{filters:MyFilters});
    grid.jqGrid('setGridParam', {search: true, postData: postData});
    console.log(grid.jqGrid('getGridParam','postData'));
}

控制台打印输出显示过滤器已就位,但 _search 仍然是假的,即使没有过滤器,实际的 Post 也会被发送:

_search   false
block_id  report_block_1table
nd        1297451574526
page      1
rows      25
sidx      id
sord      desc

但是,如果我输入完全相同的代码 - 添加

grid.trigger("reloadGrid");

行 - 进入某个按钮的 onClickButton 函数,然后单击该按钮 - 一切正常;但我需要让它在“页面重新加载”上工作!

有任何想法吗?这让我疯狂...

2个回答

在我看来,你不是第一个问同样问题的人。最近我问了关闭的问题(阅读了许多对答案的评论)。包括演示在内另一个旧答案可能会回答您提出的一些问题。

您使用的代码beforeRequest不起作用只是因为该函数beforeRequest将在 ajax 调用之前立即被调用并且search参数的更改为时已晚此外,filters每次都覆盖可能不是最好的主意。在这种情况下,用户将无法设置任何其他网格过滤器。

所以我可以重复一遍,您需要的解决方案的实现非常简单。您应该将jqGrid 参数的filters属性设置postData您需要的过滤器,并另外设置另一个 jqGrid 参数search:true都是这样!稍后用户将能够打开高级搜索对话框并覆盖过滤器。用户也可以点击高级搜索对话框的“重置”按钮并设置filters为空字符串和search:false

为了更好地理解,我必须明确searchURL 中将如何使用参数或其他一些 jqGrid。jqGrid参数prmNames定义作为 URL 的一部分或作为 POST 到服务器的数据的一部分发送的参数的名称prmNames的默认值包含search:"_search"jqGrid使用的内部填充函数的代码具有以下简化代码片段:

var prm = {}, pN=ts.p.prmNames;
if(pN.search !== null) {prm[pN.search] = ts.p.search;}
if(pN.nd !== null) {prm[pN.nd] = new Date().getTime();}
if(pN.rows !== null) {prm[pN.rows]= ts.p.rowNum;}
if(pN.page !== null) {prm[pN.page]= ts.p.page;}
if(pN.sort !== null) {prm[pN.sort]= ts.p.sortname;}
if(pN.order !== null) {prm[pN.order]= ts.p.sortorder;}
...
$.extend(ts.p.postData,prm);

在哪里

prmNames: {page:"page",rows:"rows", sort: "sidx",order: "sord", search:"_search",
           nd:"nd", id:"id",oper:"oper",editoper:"edit",addoper:"add",
           deloper:"del", subgridid:"id", npage: null, totalrows:"totalrows"}

所以要设置_searchURL 的参数,应该设置searchjqGrid 的参数。

下面的演示您可以轻松验证使用小提琴手萤火虫的jqGrid的从页面发送HTTP GET与以下网址:

http://www.ok-soft-gmbh.com/jqGrid/MultisearchFilterAtStart1.json?filters=%7B%22groupOp%22%3A%22AND%22%2C%22rules%22%3A%5B%7B%22field%22%3A%22invdate%22%2C%22op%22%3A%22gt%22%2C%22data%22%3A%222007-09-06%22%7D%2C%7B%22field%22%3A%22invdate%22%2C%22op%22%3A%22lt%22%2C%22data%22%3A%222007-10-04%22%7D%2C%7B%22field%22%3A%22name%22%2C%22op%22%3A%22bw%22%2C%22data%22%3A%22test%22%7D%5D%7D&_search=true&nd=1297508504770&rows=10&page=1&sidx=id&sord=asc

所以它完全符合你的需要。演示代码包含以下代码片段:

$("#list").jqGrid({
    url: 'MultisearchFilterAtStart1.json',
    datatype: "json",
    postData: {
        filters:'{"groupOp":"AND","rules":['+
                '{"field":"invdate","op":"gt","data":"2007-09-06"}'+
                ',{"field":"invdate","op":"lt","data":"2007-10-04"}'+
                ',{"field":"name","op":"bw","data":"test"}]}'
    },
    search:true,
    // ...
});
[编辑上一条评论的时间不够] - 当我将搜索/过滤参数放入 grid-init 参数时,它完全可以正常工作。谢谢你,我真的很感谢你的帮助!
2021-04-20 20:52:28
伟大的!!最后一段代码完全解决了这个问题 - 这个 - ` jQuery('#' + block_id).jqGrid({ url:loadUrl, mtype:'POST', postData:{block_id:block_id, filters:'{"groupOp" :"AND","rules":[{"field":"Cloud Upload", "op":"cn","data":"costa"}]}'}, search:true, autowidth:true, height : '100%', 数据类型: "json", // .. });`
2021-04-30 20:52:28

@Oleg Oleg 的回答很有魅力,但只是第一次。

对我来说,当我重新加载网格时,没有设置过滤器和搜索标志。每次我重新加载网格时,它都会使用以下代码发送过滤器和搜索标志。我使用服务器端排序和分页。

我正在使用:

jQuery("#myGrid").navGrid("#myPager", {search: true, refresh: true, edit: false, 
    add:false, del:false}, {}, {}, {}, {});

关于网格定义:

beforeRequest: function() {
    // filter to be added on each request
    var filterObj1 = {"field":"myField","op":"eq","data":"myValue"}; 
    var grid = jQuery("#myGrid");
    var postdata = grid.jqGrid('getGridParam', 'postData');             
    if(postdata != undefined && postdata.filters != undefined ) {
        postdata.filters = jQuery.jgrid.parse(postdata.filters);
        //Remove if current field exists
        postdata.filters.rules = jQuery.grep(postdata.filters.rules, function(value) {
            if(value.field != 'myField')
                return value;
        });
        // Add new filters
        postdata.filters.rules.push(filterObj1);
    } else {
        jQuery.extend(postdata, {
            filters:  { 
                "groupOp":"AND",
                "rules":[filterObj1] 
            }
        });
        // more filters in the way: postdata.filters.rules.push(filterObj1);
    }
    postdata.filters = JSON.stringify(postdata.filters);
    postdata._search = true;
    return [true,''];
}
AS Oleg 指出,如果您使用自定义值覆盖 prNames,则必须相应地修改上面的代码。
2021-05-07 20:52:28