8

Using jqGrid multiple searching how can you programatically "clear" the search options?

The "clear" should ensure no filters are being sent to the server and that the GUI search box does not contain any search criteria..

We are currently calling trigger("reloadGrid"). We'd like to call a clearSearchCrieria() type method before reloadGrid so that no filters are passed to the server or show up in the GUI search box..

??

9 Answers 9

16

You could use the following method:

function clearSearchOptions(){
    $("#list").jqGrid('setGridParam', { search: false, postData: { "filters": ""} }).trigger("reloadGrid");
}

But as Oleg pointed out, you will have to use the recreateFilter:true option in your jqgrid definition if you want the jqgrid search box to be cleared as well.

2
  • thanks, it worked for me: i was unable to SET data in Subgrid, so i wrote $("#Subgrid").jqGrid('setGridParam', { search: false, postData: { "filters": "" } }); $("#Subgrid").setGridParam({ 'data': SubgridData }).trigger('reloadGrid', [{ page: 1 }]); Oct 21, 2014 at 5:03
  • @Jimbo I don't think so reloadGrid is mandatory, For me its worked without triggering reloadGrid. Anyway Thanks for the tips. Feb 10, 2015 at 11:45
6

To reset filters you can modify the postData parameter of jqGrid directly. You can access it with $("#list").jqGrid('getGridParam','postData') or $("#list")[0].p.postData. If a filter is set, the properties of the postData look like following:

_search      true           Boolean
nd           1286296925096  Number
page         1              Number
rows         10             Number
searchField  "id"           String
searchOper   "lt"           String
searchString "5"            String
sidx         "id"           String
sord         "desc"         String

To reset the properties you can do following

var postdata = $("#list").jqGrid('getGridParam','postData');
postdata._search = false;
postdata.searchField = "";
postdata.searchOper = "";
postdata.searchString = "";

If you use Advanced Searching instead of Single Searching you should clear filters property instead of searchField, searchOper and searchString.

At the end you can call $("#list").trigger("reloadGrid",[{page:1}]); to reload the grid contain starting with the page number 1.

11
  • Thanks Oleg - but this doesn't appear to reset the grid's search UI. That is the prior search criteria still show up when you click the search button in the nav bar. I'd like to clear these out. Oct 5, 2010 at 16:59
  • 1
    @Marcus: You asked how to reset jqGrid search options. So I understood that you opened Search dialog set options and then close the search dialog. The search options stay saved in the jqGrid. So I answered how th reset the options. What you then mean? By the way do you use recreateFilter:true option?
    – Oleg
    Oct 5, 2010 at 17:34
  • We don't use the recreateFilter option.. if we manually set postdata, the search data stays saved in the grid - how do you remove the search from the grid so the gui doesn't show any search options selected? Oct 5, 2010 at 18:01
  • @Marcus: Could you explain what scenario you mean? Why do you decide that "the search data stays saved in the grid"? What do you mean? How one can reproduce your problem and which behavior exactly you want to have in jqGrid? In general there are search filter in the grid (as a part of postData) and there are a search dialog which will be hide or show. If you use recreateFilter:true option the dialog will be always new created instead of showing previously created hide dialog.
    – Oleg
    Oct 5, 2010 at 18:54
  • We have our search icon on the nav. Users can click this button, search on multiple fields - all this works great. We have another filter option outside of the grid control. If users select another type of filter, we change the grid url and call reloadGrid. But when we call reloadGrid the filter options that the user selected with the grid search are still present. What is the best way to clear out the grid search criteria? Oct 5, 2010 at 19:19
3

To click the "reset" button try:

$(".ui-reset").click();
1
  • Will try that - my post might be slightly misleading.. What I'm trying to do is clear the search options and call trigger("reloadGrid"). Your suggestion might work.. though would prefer to not literally call click.. would like to call a clearSearchOptions() method then call trigger("reloadGrid") Oct 5, 2010 at 16:27
2

The only way I could get it right - and I'm sure its not the right way is as follows:

$("#grid").jqGrid('setGridParam', { postData: { filters: null} });
$("#gs_ColName1").val("");
$("#gs_ColName2").val("");

where ColNameX are the names of your columns

1
  • ideed! Thank you! I combined your last two lines, to clean the search boxes and the first, but additionally i triggered reload!
    – Paschalis
    Aug 1, 2012 at 23:55
2

It will reset all search options

$('input[id*="gs_"]').val("");
1
  • 1
    Making a simple change to $(':input[id*="gs_"]').val(""); will find all form elements, which includes select boxes.
    – Joseph
    Oct 29, 2013 at 14:45
1
$("#resetFilterOptions").click(function(){
        $('input[id*="gs_"]').val("");
        $('select[id*="gs_"]').val("ALL");
        $("#list").jqGrid('setGridParam', { search: false, postData: { "filters": ""} }).trigger("reloadGrid");
        });

This one works Rest Search options and Reload the JQGrid

0

use only

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

0

I added external refresh button to solve this.

jgrid.jsp

<sj:submit id="grid_refreshbutton" value=" Refresh" button="true"/>

jgrid.js

$(document).ready(function(){
jQuery("#grid_refreshbutton").click(function(){
    var postData = $("#gridtable").jqGrid('getGridParam','postData');
    $("#gridtable").jqGrid('setGridParam',{search:false});    
        $.extend(postData, { filters: "" });

        for (k in postData) {
            if (k == "_search")
                { postData._search = false;}
            else if ($.inArray(k, ["nd", "sidx", "rows", "sord", "page", "filters"]) < 0) {
                    delete postData[k];
                   ("#gs_" + $.jgrid.jqID(k), $("#gridtable").get(0).grid.hDiv).val("");
            }
        }
               $("#gridtable").trigger("reloadGrid", [{ page: 1}]);         

});

Thanks/Regards, Khine lae

0
$("#search").filterGrid("#list", {
       gridModel: false,
       enableSearch: true,
       filterbutton: 'search_button',
       enableClear:true,
      filterModel: [{
           label: 'First Name',
           name: 'search',
           stype: 'text'
       }); 

Write enableClear:true in your filterGrid

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.