jqGrid filterToolbar ne fonctionne pas - ASP.NET

Question

J'essaie d'implémenter le ToolBar Search/Filtering pour jqGrid. Quand j'entre un texte dans l'un des filtres et que j'appuie, rien ne se passe - je ne suis pas sûr de ce que j'ai fait de mal ici. Toute aide est appréciée:

jQuery("#list").jqGrid({ 
      datatype: 'json', 
      url: 'GetIncidents.ashx?view=MyIncidents', 
      height: "100%", 
      scrollOffset: 0, 
      jsonReader: { 
       root: "rows", 
       page: "page", 
       total: "total", 
       records: "records", 
       repeatitems: false, 
       cell: "cell", 
       id: "ID", 
       userdata: "userdata", 
       subgrid: { 
        root: "rows", 
        repeatitems: true, 
        cell: "cell" 
       } 
      }, 
      colNames: ['ID', 'Title', 'Assigned To', 'Status', 'Priority', 'Classification', 'Affected User', 'Support Group', 'Last Modified'], 
      colModel: [ 
        { name: 'ID', index: 'ID', width: 40, sorttype: 'int', firstsortorder: 'desc' }, 
        { name: 'Title', index: 'Title', width: 180 }, 
        { name: 'AssignedUser', index: 'AssignedUser', width: 100, align: 'center' }, 
        { name: 'Status', index: 'Status', width: 50, align: 'center' }, 
        { name: 'Priority', index: 'Priority', width: 50, align: 'center' }, 
        { name: 'Classification', index: 'Classification', width: 150, align: 'center' }, 
        { name: 'AffectedUser', index: 'AffectedUser', width: 100, align: 'center' }, 
        { name: 'TierQueue', index: 'TierQueue', width: 100, align: 'center' }, 
        { name: 'LastModified', index: 'LastModified', width: 120, align: 'center', formatter: 'date', formatoptions: { srcformat: 'Y-m-d H:i:s0', newformat: 'm/d/Y h:i A'}}], 
      pager: '#pager', 
      rowNum: 15, 
      width: 980,     
      sortname: 'ID', 
      sortorder: 'desc', 
      viewrecords: true, 
      autowidth: true, 
      gridview: true, 
      ignoreCase: true, 
      caption: 'All Open Incidents Assigned To Me', 
      onSelectRow: function (id) { window.location = 'ViewIncident.aspx?id=' + id; } 
     }); 

     jQuery("#list").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" }); 

Answer 1

jqGrid repose sur le serveur pour la fonctionnalité de filtrage, si vous examinez votre action de courrier sortant, vous verrez les données supplémentaires, il ajoute au poste de transmettre les données de filtrage.

Ainsi, votre filtrage sera effectué sur le serveur, votre ensemble de données filtré sera ensuite commandé/paginé, etc, puis transmis à votre jqGrid.

Dans mon esprit, c'est l'endroit idéal pour commencer: ASP.NET MVC 2.0 Implementation of searching in jqgrid

De cet exemple il faudra un peu d'effort pour mettre en place, mais à partir de là, vous aurez une belle base pour gérer le filtrage dynamique. Si vous ne faites que du filtrage basique, vous pouvez probablement utiliser certains des composants pour pirater quelque chose, mais beaucoup après une exigence de base, il vaudra la peine d'investir le temps dans cette option supplémentaire.

Answer 2

Couple de choses essayer d'abord d'ajouter la fonction document.ready que votre navigateur charge avant de tirer la grille, puis ajoutez loadonce: true,

ensuite essayer de l'exécuter et il devrait fonctionner!

Voici le code

JQuery(document).ready(function(){ 
jQuery("#list").jqGrid({ 
     datatype: 'json', 
     url: 'GetIncidents.ashx?view=MyIncidents', 
     height: "100%", 
     scrollOffset: 0, 
     jsonReader: { 
      root: "rows", 
      page: "page", 
      total: "total", 
      records: "records", 
      repeatitems: false, 
      cell: "cell", 
      id: "ID", 
      userdata: "userdata", 
      subgrid: { 
       root: "rows", 
       repeatitems: true, 
       cell: "cell" 
      } 
     }, 
     colNames: ['ID', 'Title', 'Assigned To', 'Status', 'Priority', 'Classification', 'Affected User', 'Support Group', 'Last Modified'], 
     colModel: [ 
       { name: 'ID', index: 'ID', width: 40, sorttype: 'int', firstsortorder: 'desc' }, 
       { name: 'Title', index: 'Title', width: 180 }, 
       { name: 'AssignedUser', index: 'AssignedUser', width: 100, align: 'center' }, 
       { name: 'Status', index: 'Status', width: 50, align: 'center' }, 
       { name: 'Priority', index: 'Priority', width: 50, align: 'center' }, 
       { name: 'Classification', index: 'Classification', width: 150, align: 'center' }, 
       { name: 'AffectedUser', index: 'AffectedUser', width: 100, align: 'center' }, 
       { name: 'TierQueue', index: 'TierQueue', width: 100, align: 'center' }, 
       { name: 'LastModified', index: 'LastModified', width: 120, align: 'center', formatter: 'date', formatoptions: { srcformat: 'Y-m-d H:i:s0', newformat: 'm/d/Y h:i A'}}], 
     pager: '#pager', 
     rowNum: 15, 
     width: 980,     
     sortname: 'ID', 
     sortorder: 'desc', 
     viewrecords: true, 
     autowidth: true, 
     gridview: true, 
     ignoreCase: true, 
     loadonce:true, //**you need to add this** 
     caption: 'All Open Incidents Assigned To Me', 
     onSelectRow: function (id) { window.location = 'ViewIncident.aspx?id=' + id; } 
    }); 

    jQuery("#list").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" }); 

})