L'option de recherche Jqgrid cache la table de la grille

Question

Le problème est que lorsque je clique sur l'option de recherche (sur pager), elle affiche la fenêtre de recherche mais la grille se cache. J'inclus le fichier jqmodal.js. Mais qu'est-ce que j'ignore sur le code ci-dessous?

fichiers CSS:

jqModal.css

jquery-ui-1.8.custom.css

ui.jqgrid.css

ui.multiselect.css

jquery.searchFilter.css

fichiers js:

jquery.min.js

grid.base.js

grid.common.js

grid.formedit.js

grid.setcolumns. js

ui.multiselect.js

jquery.searchFilter.js

jqModal.js

Le 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

Cela ressemble à la même question que j'avais aujourd'hui. Le formulaire de recherche apparaîtrait mais serait sur le dessus de la grille et aucune fenêtre modale ne montrerait qui rendait l'écran inutile.

Si tel est le cas, tout ce que vous devez faire est de référence jquery.searchFilter.css

Sur l'un de mes projets, il doit être référencé dans un des fichiers de code, mais de l'autre projet, il n'a pas été référencé (ce qui m'a donné l'erreur). Dès que j'ai ajouté le fichier CSS à la page, ce problème est parti.

Espérons que cela résout votre problème.

Answer 2

J'ai eu un CSS personnalisé, j'ai enlevé un div overlay et maintenant fonctionne.

Answer 3

Je veux juste partager mon correctif pour ce problème particulier. J'utilise jQUery UI pour mon jQGrid. Avec l'aide de Firebug, j'ai vu d'où venait le problème. J'ai commenté la superposition dans la ligne 41 (qui peut différer de votre version de ui) de "jquery-ui-1.8.4.custom.css" qui dit

.ui-widget-overlay {position: absolue; en haut: 0; gauche: 0; largeur: 100%; hauteur: 100%; }

et tout fonctionne bien après cela.