The issue is when I click on search option (on pager) it shows the search window but the grid gets hide. I'm including the jqmodal.js file. But what I'm ignoring on the code below?

css files:

jqModal.css

jquery-ui-1.8.custom.css

ui.jqgrid.css

ui.multiselect.css

jquery.searchFilter.css

js files:

jquery.min.js

grid.base.js

grid.common.js

grid.formedit.js

grid.setcolumns.js

ui.multiselect.js

jquery.searchFilter.js

jqModal.js

The Javascript:

$("#list").jqGrid({
        url: 'foo_report.php?g=' + $('#fooselect').val() + '&report=1&searchString=null&searchField=null&searchOper=null',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['foo1','foo2', 'foo3'],
        colModel: [
          { name:'rows.foobar1',                index: 'foobar1',   search:true, jsonmap: 'foobar1', width: 150, align: 'left', sortable:true},
          { name:'rows.foobar2',                index: 'foobar2',    jsonmap: 'foobar2', width: 150, align: 'left'},
          { name:'rows.foobar3',                index: 'foobar3',    jsonmap: 'foobar3', width: 240, align: 'left', sortable: true}],

        pager: '#pager',
        rowNum: 8,
        autowidth: true,
        rowList: [8, 16],
        sortname: 'foobar1',
        sortorder: 'asc',
        viewrecords: true,
        search : {
                    caption: "Search...",
                    Find: "Find",
                    Reset: "Reset",
                    odata : ['equal', 'not equal', 'less'],
                    groupOps: [ { op: "AND", text: "all" }, { op: "OR", text: "any" }],
                    matchText: " match",
                    rulesText: " rules"
                  },
        caption: 'Foobar Data',
        jsonReader : {
                        root: "rows",
                        repeatitems: false
                      },
        height: 350,
        width: 800
});


html:

<table id="list"></table>
<div id="pager"></div>