简体   繁体   中英

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

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.

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

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());
});

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?

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();
    });
});

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

$("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

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

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

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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