简体   繁体   English

如何操纵jqGrid的搜索/过滤器?

[英]How do I manipulate a jqGrid's search/filters?

I have a jqGrid with a navBar that has search: true and multipleSearch: true . 我有一个带有navBar的jqGrid,它有search: truemultipleSearch: true I would like to add a button to my UI that automatically adds an additional rule to the search. 我想在我的UI中添加一个按钮,自动为搜索添加一个额外的规则。

I've tried manipulating the postData for the filter directly, but values added this way don't show up in the search UI. 我已经尝试直接操作过滤器的postData,但是这样添加的值不会显示在搜索UI中。

I've also tried accessing the search box directly using jQuery, like this: 我也尝试使用jQuery直接访问搜索框,如下所示:

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

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). 但是,除了感觉hackish之外,它只有在用户已经点击了搜索按钮(fbox_list div不是在加载时构建)时才有效。

Has anyone else dealt with an issue like this? 还有其他人处理过这样的问题吗?

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 : 网格的ID为list ,寻呼机的ID为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();
    });
});

清除输入,选择和重置网格

$("td#refresh_navGrid").click();

If you mean the filter toolbar, you can do this: (status is the col name -- so, replace "#gs_status" w/ "#gs_" + your_col_name 如果您指的是过滤器工具栏,您可以这样做:(状态是列名称 - 所以,将“#gs_status”替换为“#gs_”+ your_col_name

        jQuery("#distributor_grid").jqGrid('showCol',['status']);           
        jQuery(".ui-search-toolbar #gs_status")
            .val('ALL')
            ;

        $('#distributor_grid').RefreshData();  // triggers toolbar

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM