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..

??

Marcus Leon
  • 50,921
  • 112
  • 279
  • 413

9 Answers9

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.

Jimbo
  • 20,449
  • 37
  • 111
  • 151
  • 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 }]); – Dot_NET Pro Oct 21 '14 at 05:03
  • @Jimbo I don't think so reloadGrid is mandatory, For me its worked without triggering reloadGrid. Anyway Thanks for the tips. – Madhan Ayyasamy Feb 10 '15 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.

Oleg
  • 217,934
  • 30
  • 386
  • 757
  • 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. – Marcus Leon Oct 05 '10 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 05 '10 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? – Marcus Leon Oct 05 '10 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 05 '10 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? – Marcus Leon Oct 05 '10 at 19:19
  • @Marcus: It is exactly the scenario which I mean as I wrote my answer. If the code from my answer not work then try `var sdata={searchField:"",searchOper:"",searchString:""}; $.extend($("#list")[0].p.postData,sdata); $("#list")[0].p.search=false;` – Oleg Oct 05 '10 at 20:01
  • Tried both - couldn't get either to work - search GUI still has prior selections in place. As I'm using the advanced search I modified your last example slightly to use `var sdata={filters:""};` – Marcus Leon Oct 06 '10 at 19:46
  • @Marcus: I can repeat only once. You should post a full code example then I'll try to modify it so that it will work. – Oleg Oct 06 '10 at 21:44
  • @Oleg: I was really happy to see the `recreateFilter` option on jqgrid. I also have an external jqgrid filter and wanted jqgrid's search button to reflect what the external filter was filtering. It works the first time jqgrid's search is clicked only :( then if you change the external filter and click jqgrid's search button again, it shows the old filter... – Jimbo Dec 01 '10 at 06:46
  • @Marcus: I found that using recreateFilter: true and Oleg's solution of resetting search params above or even using Mark's answer below (except I use `$(".ui-icon-refresh").trigger("click");`) works great. The jqgrid search panel resets itself too :) – Jimbo Dec 01 '10 at 06:50
  • @Jimbo: Hi! In my opinion the values `recreateFilter:true` and `recreateForm:true` for the form editing should be default settings of jqGrid. Without the settings one can has strange effects and spend many time in debugging. By the way my other old answer http://stackoverflow.com/questions/3974324/jqgrid-using-multiple-methods-to-filter-data/3979490#3979490 and the corresponding demo example http://www.ok-soft-gmbh.com/jqGrid/CheckboxesWithVerticalHeaders1.htm could be probably interesting for you. – Oleg Dec 01 '10 at 15:05
3

To click the "reset" button try:

$(".ui-reset").click();
Mark
  • 101,574
  • 16
  • 158
  • 219
  • 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")` – Marcus Leon Oct 05 '10 at 16:27
2

It will reset all search options

$('input[id*="gs_"]').val("");
neeraj
  • 7,235
  • 16
  • 55
  • 84
  • 1
    Making a simple change to `$(':input[id*="gs_"]').val("");` will find all form elements, which includes select boxes. – Joseph Oct 29 '13 at 14:45
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

Peter Munnings
  • 3,159
  • 1
  • 27
  • 43
  • ideed! Thank you! I combined your last two lines, to clean the search boxes and the first, but additionally i triggered reload! – Paschalis Aug 01 '12 at 23:55
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

user2675617
  • 236
  • 3
  • 4
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

analyticalpicasso
  • 1,955
  • 6
  • 23
  • 45
Rakesh
  • 36
  • 4
0

use only

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

Mateus Padua
  • 163
  • 1
  • 8
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

Khine Lae
  • 1