Tutorial :is there a way to programatically set a filter in jquery jqgrid?


i have a page with a jqgrid on it with filter row at the top. I want to have a link on another page that loads this grid page but with a filter set on one of the columns. is that possible to do from a link or any other workaround people can suggest?


the way i solved this was to pass in the following code:

var myfilter = { groupOp: "AND", rules: [] };  myfilter.rules.push({ field: "DataIssuesYN", op: "eq", data: "Y" });  

and then in the jqGrid setup, I pass into postData:

  postData: (myfilter) ? { filters: JSON.stringify(myfilter)} : {},  


You can modify the url that jqGrid calls, and add the filter option to the querystring, then handle it on the server side.

$(link).click(function(){    $(".mygrid").jqGrid('setGridParam',{url:"server.php?useMyFilter=1"})  });  


solution 1.

prgramatically in javascript: use the hideCol and give it the column name or a set of columns [colnames,otherone] the jqGrid object Given a single colname, will hide that column with that name. Given an array of colnames [“name1”,”name2”], it will hide the columns with those names, 'name1' and 'name2', in the example. The names in colname or colnames must all be valid names from the colModel. Remember that this will not change the width of the column so you still have to change tthe colModel example: colModel :[ {name:'photo', index:'photo', width:605, sortable:false} ,

... jQuery("#grid_id").setGridParam({...}).hideCol("photo").trigger("reloadGrid"); ...

solution 2: solution 1:

jQuery(document).ready(function(){ jQuery("#list").jqGrid({ url:'json.php?myfilter=columnname', datatype: 'json',//or xml? mtype: 'GET', //

then in json.php you can take the column key out of your array before printing it


You can try to use dataInit property of searchoptions in the colModel. This function has one parameter elem. The $(elem) will represent the input html element which you can initialize with any data which you need.

UPDATED: Try to include following option in colModel in the description of the column where you want set the filter:

searchoptions:{      dataInit:function(elem){          $(elem).val("Test");          setTimeout(function(){              $(elem).focus().trigger({ type: 'keypress', charCode: 13 });          },500);     }  }  

in this example I set "Test" text as the filter and simulate press enter key. I suppose that searchOnEnter set to default value true. The forwarding of the filter string (like "Test") is very depended on the structure of your program, but I hope that it can be easy implemented.

UPDATED 2: Probably there are different understanding how should be understand "a page with a jqgrid on it with filter row at the top". I read it like a setting of filter in the filter toolbar, because the filter toolbar will be added as a row on the top of grids rows. My solution live can be seen here Setting filter in the filter toolbar

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »