If you're looking to create a filter for the jqGrid toolbar, it should be a simple process. You can refer to the "new in 3.5, integrated search toolbar" example or check out the documentation here and here.
However, I've been encountering an error every time I run the line
myDataTable.jqGrid('filterToolbar', filterOpts);
. The error message reads: "Unable to get value of the property 'colModel': object is null or undefined" in line 3613 of JQuery.jqGrid.src.js, which is: $.each($t.p.colModel,function(i,n) { ..
For reference, I am using jqGrid version 4.1.2 and the grid itself seems to be displaying and functioning correctly.
Here is the code snippet where I initialize the grid. I suspect I may be overlooking something quite simple.
var ft = document.getElementById("myData"); // this refers to the HTML table element
var colModel = [
{ name: 'i', index: 'i', width: 60, hidden: true, search: false },
{ name: 'c', index: 'c', width: 100, search: true },
{ name: 'p', index: 'p', width: 100, search: true },
{ name: 'displayed', index: 'displayed', align: 'center', width: 100, formatter: booleanToCheckmark, search: false },
];
$(function() {
$(ft).jqGrid({
datatype: 'clientSide',
data: globals.myData,
height: 300,
width: 300,
forceFit: true,
colNames: ['I', 'C', 'P', 'dis.'],
colModel: colModel,
rowNum: 10000,
sortname: 'displayed',
sortorder: 'desc',
viewrecords: true,
gridview: true,
caption: 'XYZ'
});
});
var filterOpts = { autosearch: true };
// The following line is where the issue occurs
$(ft).jqGrid('filterToolbar', filterOpts);