如何操作jqGrid的搜索/过滤器? [英] How do I manipulate a jqGrid's search/filters?

问题描述

我有一个带有navBar的jqGrid，该navBar具有search: true和multipleSearch: true.我想在我的UI中添加一个按钮，该按钮会自动向搜索添加一个附加规则.

I have a jqGrid with a navBar that has search: true and multipleSearch: true. I would like to add a button to my UI that automatically adds an additional rule to the search.

我尝试直接为过滤器操作postData，但是以这种方式添加的值不会显示在搜索用户界面中.

I've tried manipulating the postData for the filter directly, but values added this way don't show up in the search UI.

我还尝试过使用jQuery直接访问搜索框，如下所示:

I've also tried accessing the search box directly using jQuery, like this:

$('#fbox_list').searchFilter().add();
$('#fbox_list .sf .data input').each(function(index) {
    alert($(this).val());
});

但是，除了感到骇人听闻之外，它仅在用户已经单击搜索按钮时才起作用(fbox_list div不在加载时构建).

But, in addition to feeling hackish, it only works if the user has already clicked on the search button (the fbox_list div is not constructed on load).

还有其他人处理过这样的问题吗?

Has anyone else dealt with an issue like this?

推荐答案

为了后代，这是我当前正在使用的hack.网格的ID为list，而寻呼机的ID为pager:

For the sake of posterity, here is the hack I'm currently using. The grid has an ID of list and the pager has an ID of pager:

jQuery(document).ready(function() {
    //Initialize grid.

    //Initialize the navigation bar (#pager)

    //Hack to force creation of the search grid.
    //The filter's ID is of the form #fbox_<gridId>
    jQuery('#pager .ui-icon-search').click();
    jQuery('#fbox_list').searchFilter().close();

    //Example button events for adding/clearing the filter.
    jQuery("#btnAddFilter").click(function() {
        //Adds a filter for the first column being equal to 'filterValue'.
        var postFilters = jQuery("#list").jqGrid('getGridParam', 'postData').filters;
        if (postFilters) {
            $('#fbox_list').searchFilter().add();
        }

        var colModel = jQuery("#list").jqGrid('getGridParam', 'colModel');
        //The index into the colModel array for the column we wish to filter.
        var colNum = 0;
        var col = colModel[colNum];

        $('#fbox_list .sf .fields select').last().val(col.index).change();
        $('#fbox_list .sf .data input').last().val('filterValue');

        $('#fbox_list .sf .ops select.field' + colNum).last().val('eq').change();

        $('#fbox_list').searchFilter().search();
    });

    jQuery("#btnClearFilter").click(function() {
        $('#fbox_list').searchFilter().reset();
    });
});

这篇关于如何操作jqGrid的搜索/过滤器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！