Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jqGrid Filter Toolbar initial default value

Tags:

jquery

jqgrid

I'm using jqGrid with the filter toolbar, i need to set an initial default filter value to one of the fields so that only rows with status 'Open' are displayed by default, but the user can display Closed rows if desired.

At the moment i have a workaround like this

setTimeout(function() {$('#gs_Status').val('Open');$("#eventsGrid")[0].triggerToolbar()},500);

but it results in a second request and is pretty bad really.

Does anybody know how to do this?

Edit: A bit more research tells me this is probably impossible :(

like image 279
Paul Creasey Avatar asked Mar 13 '10 23:03

Paul Creasey


2 Answers

There are a few steps to do this:

  1. pass a default value in the column model search options
  2. prevent the default form data load process
  3. trigger a filter toolbar data load when the table is ready

In a bit more detail:

Set the grid datatype to local (this prevents the initial data load) and set the default value for the search options:

  $("#mytable").jqGrid({
    datatype: "local",
    colNames:['Keyword','Selected'], 
    colModel:[
     {name:'keyword',
      sortable:true,
      searchoptions: { defaultValue:'golf' }
    },
    {name:'selected',
      sortable:false,
      searchoptions: { }
    },
    ....
    ....

Then add the filter toolbar, set the data type and url, and trigger the load:

  $('#mytable').jqGrid('filterToolbar', {autosearch: true});
  $('#mytable').setGridParam({datatype: 'json', url:'/get_data.php'});
  $('#mytable')[0].triggerToolbar();
like image 194
Mark B Avatar answered Sep 21 '22 17:09

Mark B


All the tips I read didn't work for me. So I tried a lot and did some research in the jqGrid source code. It's much easier to integrate a "default value" or "saved search values" functionality, if you use the beforeRequest event.

I had to solve some problems:

  1. Although it's the beforeRequest event, the search parameters you set there won't be used until you call triggerToolbar.
  2. triggerToolbar does not only set the new request with the new search parameters, but also triggers a reload of the table data - but the previous request is still running, so you do the same request twice (both with the new search parameters).
  3. Set default values but allow the user to clear/overwrite them.
  4. Avoid endless loops and keep the old search functionality.

Here's the code:

beforeRequest: function ()
{
    // Activate filter toolbar and define "beforeSearch" callback
    // to avoid a second search request on page load, triggered 
    // by "triggerToolbar()" when not set.
    //
    // Important: 
    // "beforeSearch" has to return true to avoid the second
    // request on page load, but it has to return false for all
    // following searches (otherwise it wouldn't be possible to
    // submit new searches by pressing Enter in search input fields).
    $("#myTable").jqGrid('filterToolbar', {
        beforeSearch: function(){
            if ($(this).data('firstSearchAbortedFlag') != '1')
            {
                $(this).data('firstSearchAbortedFlag', '1');
                return true;
            }

            // Return false or add your customizations here...
            return false;
        }
    });

    if ($(this).data('defaultValuesSetFlag') != '1')
    {
        // Set flag to set default only the first time when
        // the page is loaded.
        $(this).data('defaultValuesSetFlag', '1');

        // Set default values...
        // (id = 'gs_' + fieldname)
        $('#gs_field_a').val('value a');
        $('#gs_field_b').val('value b');

        // Call "triggerToolbar" to use the previously set
        // parameters for the current search.
        // 
        // Important: 
        // Set "beforeSearch" callback for "filterToolbar" to avoid
        // a second search request, triggered by "triggerToolbar".
        $("#myTable")[0].triggerToolbar();
    }
}

I hope this helps you!

like image 32
Ziege Avatar answered Sep 19 '22 17:09

Ziege