javascript – 我需要帮助自动化jqGrid过滤器

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

到目前为止,有很多谷歌,试验和错误和汗水,我有以下工作：

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

– >我可以使用预定义的搜索过滤器加载搜索对话框.网格加载后,我可以打开模态对话框并查看正确的过滤器,如果单击“查找”,相应的数据将发布到服务器,并将正确的结果返回到屏幕.

我认为现在正在咬我的东西是容易的部分,但它逃脱了我.我似乎无法做以下任何一种情况：

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

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

由于今天我可以手动点击“查找”按钮并且它有效,我认为“B”将是一个很好的下一步.所以,在我的gridComplete函数中,我有以下代码：

    $('#AccountGrid').clearFilter({gridName:'AccountGrid',pagerName:'AccountPager'});
    $('#AccountGrid').addFilter({gridName:'AccountGrid',field:'AccountID',data:1,op:'ne'});
    $('#AccountGrid').addFilter({gridName:'AccountGrid',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: 'Boxonly: 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',op:'ne'});
                $('#AccountGrid').addFilter({gridName:'AccountGrid',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
        {}
    );

并且,根据请求,这是我添加/清除过滤器的代码：

/*
    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="">Box_' + 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 });