5

Currently I have a grid set up with the search enabled. When I run a search everything works fine and I can return good data back to the grid. I see that the "_search" parameter on the URL is set to "true" and all is well.

However, when finished with the search and the data is no longer relevant, I would like to reload the grid to display the previous data that was there (the data displayed on the initial pageload). I made a function to call the "trigger("reloadGrid")" method, but that just sends the same data with the "_search" still set to "true".

Is there a way to clear out the search request data and just reload the initial data shown on pageload or at least set the "_search" value back to "false" so I can check against it? Currently the only way to display the original data is to reload the page.

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
ackerchez
  • 1,684
  • 7
  • 28
  • 49
  • The answer kind of depends on what kind of searching you have implemented. Toolbar searching, single search, advanced search? – Gregg Oct 21 '10 at 16:51

2 Answers2

15

If you use jqGrid searching the following two things will be set

  1. search parameter of jqGrid will be set to true.
  2. postData parameter of jqGrid will be modified. The value of the postData parameter is a object which has some properties. In case of single searching the properties searchField, searchString and searchOper will be set. In case of advanced searching only the property filters of the postData parameter will be set. (The property _search will be also set but from another component of jqGrid, so it is not important for the reset of searching.)

So to reset the searching you can define the following event handler for your "Reset Search" button:

$("#resetSearch").click(function() {
    var grid = $("#list");
    grid.jqGrid('setGridParam',{search:false});

    var postData = grid.jqGrid('getGridParam','postData');
    $.extend(postData,{filters:""});
    // for singe search you should replace the line with
    // $.extend(postData,{searchField:"",searchString:"",searchOper:""});

    grid.trigger("reloadGrid",[{page:1}]);
});

You can see all this live in the following demo. In the demo you should first click on the "Search" button of the navigation bar and set a search filter. Then you can click on the "Reset Search" button and reset it.

Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Thanks for the great answer. Would this also work if I have the grid set to work off of GET data and not POST? I have tried just replacing the URL with a new one for GET data but I find that it just sends the parameters twice. – ackerchez Oct 25 '10 at 08:26
  • @ackerchez: Yes it works for both HTTP POST and GET. It is advantage of the `postData`. In case of GET all parameters from the `postData` will be appended to the `url`. If current `url` value contain `?` then the parameters will be appended starting with `?`. If not, then it will be appended started wth `&`. So all is very simple and work stable. – Oleg Oct 25 '10 at 09:00
  • OMG! Oleg did you implemented yourself jqgrid?? Found you on every single post! Thanks ONE MORE time. – Paschalis Aug 01 '12 at 23:44
  • 1
    @Paschalis: No, I didn't. I used just jqGrid in my project. Because jQuery and jqGrid was new for me I started to answer on the questions about the subject on the stackoverflow to hold the new knowledge better. Later I wrote more and more answers and posted in [trirand forum](http://www.trirand.com/blog/?page_id=393) many suggestions to improve jqGrid. So I'm not the developer of jqGrid, I'm just a user who share his knowledge with other and use the advantages of the open source projects. – Oleg Aug 02 '12 at 07:23
  • This is out of topic: i want to contact you @Oleg. I dont know how to edit in jqgrid. Can you help me to this? [My question](http://stackoverflow.com/questions/11761471/edit-row-in-jqgrid4-0-how-editurl-editurl-php-must-be) Any tutorial or something? In demos, i cant find anysource, of editurl! – Paschalis Aug 02 '12 at 07:32
  • 1
    @Paschalis: I don't use PHP myself, so I can't give you reference to a good example or tutorial. In the example you use form editing and the documentation of the interface with the server is [here](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing#what_is_posted_to_the_server). You can use [Fiddler](http://www.fiddler2.com/fiddler2/), [Firebug](http://getfirebug.com/) etc to see exactly what will be sent to the server. You should just use the information on the server side in your PHP code. – Oleg Aug 02 '12 at 07:48
2

To clean the filter windows (both text and select) Had a following addition (whole function):

function filtReset() {

    $("#list").jqGrid('setGridParam',{search:false});

    var postData = $("#list").jqGrid('getGridParam','postData');

    $.extend(postData, { filters: "" });

    for (k in postData) {
        if (k == "_search")
            postData._search = false;
        else if ($.inArray(k, ["nd", "sidx", "rows", "sord", "page", "filters"]) < 0) {
            try {
                delete postData[k];
            } catch (e) { }

            $("#gs_" + $.jgrid.jqID(k), $("#list").get(0).grid.hDiv).val("");

        }
    }
    $("#list").trigger("reloadGrid", [{ page: 1}]);
    // for singe search you should replace the line with
    // $.extend(postData,{searchField:"",searchString:"",searchOper:""});
}
Exa
  • 4,020
  • 7
  • 43
  • 60
Vitaliy
  • 21
  • 1