我需要sme帮助来自动化jqGrid过滤器 [英] I need sme help automating jqGrid filters, please

问题描述

好的，总而言之，我需要做的是在加载jqGrid时自动将一组排序条件和数据过滤器应用于jqGrid.目的是让用户从大约10个预填充的过滤器开始，然后，如果他们选择的话，他们可以更改这些过滤器或进行排序，只要他们认为合适即可.

Okay, so in a nutshell, what I need to do is to automatically apply a set of sorting criteria and data filters to the jqGrid when it loads. The intent is that the user will start with about 10 pre-filled filters and then, if they so choose, they can alter those filters or the sorting however they see fit.

到目前为止，由于有很多Google知识，反复试验和汗水，我的工作如下:

So far, with much Google-ing, trial and error and sweat, I have the following working:

->我可以加载/保存排序列&会话cookie中的排序顺序.

-> I can load/save the sort column & sort order in a session cookie.

->我可以使用预定义的搜索过滤器加载搜索对话框.网格加载后，我可以打开模式对话框并查看适当的过滤器，如果单击查找"，则将适当的数据发布到服务器，并将正确的结果返回到屏幕.

-> I can load the search dialog with pre-defined search filters. After the grid loads, I can open the modal dialog and see the proper filters and if I click "Find" the appropriate data is posted to the server and the right results are returned to the screen.

我认为，现在困扰我的事情是轻松的部分，但它使我逃脱了.我似乎无法执行以下任一操作:

The thing that is biting me in the butt right now is, I think, the easy part, but it escapes me. I can't seem to do either of the following:

(A)理想的情况是，如果我可以将这些过滤器附加到网格上，并且在初始加载之前就发布数据，这样就只有一次到服务器的行程了.

( A ) The ideal thing would be if I could attach these filters to the grid and it's post data in advance of the initial load so that there is only a single trip to the server.

(B)可行的解决方案虽然不太理想，但将使网格首先加载未过滤数据的第一页，然后应用过滤器并重新向服务器查询已过滤数据.

( B ) The workable solution, though less ideal, would be for the grid to load the first page of the unfiltered data first, and then apply the filters and re-query the server for the filtered data.

由于我今天可以手动单击查找"按钮并且它起作用了，因此我认为"B"将是一个不错的下一步.因此，在我的gridComplete函数中，我有以下代码:

Since I can manually click the "find" button today and it works, I thought that "B" would be a good next-step. So, in my gridComplete function, I have the following code:

    $('#AccountGrid').clearFilter({gridName:'AccountGrid', pagerName:'AccountPager'});
    $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:1, op:'ne'});
    $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:3, op:'ne'});
    // $('#fbox_AccountGrid').searchFilter().search();
    // $('#fbox_AccountGrid .ui-search').click();
    $('#AccountGrid').trigger('reloadGrid');

NOTE: "clearFilter" and "addFilter" are extension functions I have added to jqGrid to simplify adding and removing filters on the grid.  They work exactly as desired at this point.

As you can see with those last three lines of code, I have tried using the built-in function, as well as going after the find button directly and even just forcing the entire grid to refresh.  Either way, there is no attempt by the grid to go get new data (I am using Fiddler to watch for it).

What am I doing wrong in trying to force the grid to reload with the new filters?

And, if you know how, can you give me some direction on how to get the initial load of the grid to respect these filters?

TIA

Tony


Here is the full grid configuration (minus the extra columns and some colModel "cruft"):


    jQuery('#AccountGrid').jqGrid({
        url: '<my URL>',
        width: 950,
        height: 330,
        shrinkToFit: 'true',
        datatype: 'json',
        mtype: 'POST',
        multiselect: true,
        multiboxonly: true,
        multiselectWidth: 20,
        colNames: [
            'Account ID'
        ],
        colModel: [
            { name: 'AccountID', index: 'AccountID', sortable: false, hidden:false, search:true }
        ],
        gridComplete: function () {
            // add the search criteria to the grid
            if (initialLoad == true){
                $('#AccountGrid').clearFilter({gridName:'AccountGrid', pagerName:'AccountPager'});
                $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:1, op:'ne'});
                $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:3, op:'ne'});
                // $('#fbox_AccountGrid').searchFilter().search();
                // $('#fbox_AccountGrid .ui-search').click();
                $('#AccountGrid').trigger('reloadGrid');
                initialLoad = false;
            }
        },
        jsonReader: {
            repeatitems: false,
            id: 'AccountID'
        },
        pager: jQuery('#AccountPager'),
        rowNum: 50,
        rowList: [10, 15, 25, 50, 75, 100],
        onSortCol : function (sortname, indexColumn, sortorder){
            $.cookie('AccountGrid_sortname', sortname);
            $.cookie('AccountGrid_sortorder'  , sortorder);
        },
        sortname : $.cookie('AccountGrid_sortname') ? $.cookie('AccountGrid_sortname') : 'AccountID',
        sortorder: $.cookie('AccountGrid_sortorder') ? $.cookie('AccountGrid_sortorder') : 'asc',
        viewrecords: true,
        imgpath: ''
    });

    $('#AccountGrid').jqGrid('navGrid','#AccountPager', 
        { view: false, add: false, edit: true, del: false,
          alertcap:'No Account Selected',
          alerttext: 'Please select an Account from the grid before performing this operation.',
          editfunc: showAccountEditDialog },
        {}, // default settings for edit
        {}, // default settings for add
        {}, // delete
        {closeOnEscape: true, multipleSearch: true, closeAfterSearch: true }, // search options
        {}
    );

并且，根据要求，这是我用于添加/清除过滤器的代码:

And, by request, here is the code I have for add/clear filter:

/*
    This is a grid extension function that will insert a new filter criteria
    on the specified grid with the provided field, operation & data values
*/
(function ($) {
    jQuery.jgrid.addSearchFilter =
    {
        // get/set the parameters
        addFilter: function (options) {
            var grid = $(this);
            // get offset values or assign defaults
            var settings = $.extend({
                gridName: '',
                field: '',
                data: '',
                op: ''
            }, options || {});
            // get the column model object from the grid that matches the provided name
            var colModel = grid.getGridParam('colModel');
            var column;
            for (var i = 0; i < colModel.length; i++) {
                if (colModel[i].name == options.field){
                    column = colModel[i];
                    break;
                }
            }
            colModel = null;
            if (column){
                // if the last filter has a value, we need to create a new one and not overwrite the existing ones
                if ($('#fbox_' + options.gridName + ' .sf .data input').last().val()){
                    $('#fbox_' + options.gridName).searchFilter().add();
                }
                // assign the selections to the search dialog
                $('#fbox_' + options.gridName + ' .sf .fields select.field').last().val(column.index).change();
                $('#fbox_' + options.gridName + ' .sf .data input').last().val(options.data);
                $('#fbox_' + options.gridName + ' .sf .ops select.default').last().val(options.op).change();
            }
        }
    }
})(jQuery);
jQuery.fn.extend({ addFilter: jQuery.jgrid.addSearchFilter.addFilter });

/*
    This is a grid extension function that will clear & reset the filter criteria
*/
(function ($) {
    jQuery.jgrid.clearSearchFilter =
    {
        // get/set the parameters
        clearFilter: function (options) {
            var grid = $(this);
            // get offset values or assign defaults
            var settings = $.extend({
                gridName: '',
                pagerName: ''
            }, options || {});
            // clear the filters and "pop" the dialog to force the HTML rendering
            $('#fbox_' + options.gridName).searchFilter().reset();
            $('#' + options.pagerName + ' .ui-icon-search').click();
            $('#fbox_' + options.gridName).searchFilter().close();
        }
    }
})(jQuery);
jQuery.fn.extend({ clearFilter: jQuery.jgrid.clearSearchFilter.clearFilter });

推荐答案

首先，因为您没有发布定义jqGrid的代码，所以我自己做了一些假设.我会尝试以您提出的问题中的间接信息为基础.

First of all because you don't post the code which define the jqGrid I make some assumption myself. I try to base on indirect information from your question.

1)我假设您使用jqGrid的服务器端datatype参数，例如'json'或'xml'. 2)您不使用loadonce:true参数.通常，可以从具有loadonce:true的网格中重新加载服务器，但是在这种情况下，您必须将datatype参数的值重置为初始值(值"json"或"xml"中的一个).

1) I suppose that you use server side datatype parameter of jqGrid like 'json' or 'xml'. 2) You don't use loadonce:true parameter. In general if would be possible to make server reload from the grid having loadonce:true, but in the case you have to reset the value of datatype parameter to initial value (one from the value 'json' or 'xml').

以下三个旧答案:此(对于单值搜索)和高级搜索或另一个答案显示了在不需要过滤器时如何清除它.

The following three old answer: this (in case of single value searching) and this (in case of advanced searching or the toolbar searching with additional parameter stringResult:true) will give you enough information about setting the searching filters and reloading the grid corresponds to the new filters. Another answer shows how to clear the searching filter if it is no more needed.

第一次使用过滤器加载网格是另一个问题.它可以很容易实现.您应该只使用datatype:"local"而不是您真正需要的datatype:"json"或datatype:"xml".如果jqGrid的url参数在第一次加载时被忽略，并且jqGrid不向服务器发送请求.然后，根据需要设置过滤器，然后使用$("#youGridId").trigger("reloadGrid");

Loading of the grid at the first time with the filters is another question. It can be very easy implemented. You should just use datatype:"local" instead of datatype:"json" or datatype:"xml" which you really need. In the case the url parameter of jqGrid will be just ignored at the first load and jqGrid send no request to the server. Then you set the filters like you as need and only then use $("#youGridId").trigger("reloadGrid");

reloadGrid在您的情况下不起作用的原因我无法确切知道，但是我想您没有设置jqGrid的search:true参数，该参数经常与_search属性混淆postData参数的值(请参见

The reason why the reloadGrid didn't work in your case I could not know exactly, but I suppose that you didn't set the search:true parameter of the jqGrid which one confuses frequently with the _search property of the postData parameter (see here).

这篇关于我需要sme帮助来自动化jqGrid过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！