Опция поиска Jqgrid скрывает таблицу сетки

Question

Проблема в том, что когда я нажимаю на опцию поиска (на пейджере), она отображает окно поиска, но сетка скрывается. Я включаю файл jqmodal.js. Но что я игнорирую в коде ниже?

css файлы:

jqModal.css

JQuery-щ-1.8.custom.css

ui.jqgrid.css

ui.multiselect.css

jquery.searchFilter.css

js файлы:

jquery.min.js

grid.base.js

grid.common.js

grid.formedit.js

grid.setcolumns.js

ui.multiselect.js

jquery.searchFilter.js

jqModal.js

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>

Answer 1

Звучит так же, как и у меня сегодня.Форма поиска будет отображаться, но будет в верхней части таблицы, и никакое модальное окно не покажет, что делает экран бесполезным.

Если это так, все, что вам нужно сделать, это указать jquery.searchFilter.css.

В одном из моих проектов на него нужно ссылаться в одном из файлов кода, но в другом проекте на него не ссылались (что и дало мне ошибку).Как только я добавил файл css на страницу, эта проблема исчезла.

Надеюсь, это решит вашу проблему.

Answer 2

Просто хочу поделиться своим исправлением для этой конкретной проблемы.

Я использую jQUery UI для моего jQGrid.С помощью firebug я увидел, откуда возникла проблема.Я прокомментировал наложение в строке 41 (которая может отличаться от вашей версии пользовательского интерфейса) для «jquery-ui-1.8.4.custom.css», которое говорит

.ui-widget-overlay {position: absolute;верх: 0;слева: 0;ширина: 100%;высота: 100%;}

и после этого все работает нормально.

Answer 3

У меня был собственный CSS, я удалил оверлейный div и теперь работает.