jqGrid tri sur le côté client

Question

J'ai une arborescence avec des lignes de chargement automatique. Le but est de trier la grille par colonne d'arbre, à droite sur côté client.

Mais chaque fois que je clique sur l'en-tête de colonne, émet un appel Ajax pour le tri, mais tout ce dont j'ai besoin est le tri sur place en utilisant les données locales.

Ai-je des paramètres de grille incorrects ou ne fonctionne-t-il pas avec le tri côté client dans la colonne arborescente?

jqGrid actuels params pour le tri sont sont:

loadonce: true, // to enable sorting on client side 
sortable: true //to enable sorting 

Answer 1

Pour obtenir le tri au travail côté client, je devais appeler reloadGrid après la grille a été chargée:

loadComplete: function() { 
    jQuery("#myGridID").trigger("reloadGrid"); // Call to fix client-side sorting 
} 

Je n'ai pas pour ce faire sur une autre grille dans mon application car il a été configuré pour utiliser les données récupérées via un autre appel AJAX, au lieu de données récupérées directement par la grille:

editurl: "clientArray" 
datatype: "local" 

Answer 2

J'utilise le tri côté client sur jqGrid et récupère un nouvel ensemble de données json quand une liste de sélection change. Vous devez définir rowTotal sur une valeur supérieure ou égale au nombre de lignes renvoyées, puis définir le type de données sur "json" juste avant de recharger la grille.

// Select list value changed 
$('#alertType').change(function() { 
     var val = $('#alertType').val(); 
     var newurl = '/Data/GetGridData/' + val; 
     $("#list").jqGrid().setGridParam({ url: newurl, datatype: 'json' }).trigger("reloadGrid");   
}); 

// jqGrid setup 
$(function() { 
     $("#list").jqGrid({ 
      url: '/Data/GetGridData/-1', 
      datatype: 'json', 
      rowTotal: 2000, 
      autowidth: true, 
      height:'500px', 
      mtype: 'GET', 
      loadonce: true, 
      sortable:true, 
      ... 
      viewrecords: true, 
      caption: 'Overview', 
      jsonReader : { 
       root: "rows", 
       total: "total", 
       repeatitems: false, 
       id: "0" 
      }, 
      loadtext: "Loading data...", 
     }); 
    }); 

Answer 3

$(function() { 
     $("#list").jqGrid({ 
      url: '/Data/GetGridData/-1', 
      datatype: 'json', 
      rowTotal: 2000, 
      autowidth: true, 
      height:'500px', 
      mtype: 'GET', 
      loadonce: true, 
      sortable:true, 
      ... 
      viewrecords: true, 
      caption: 'Overview', 
      jsonReader : { 
       root: "rows", 
       total: "total", 
       repeatitems: false, 
       id: "0" 
      }, 
      loadtext: "Loading data...", 
     }); 
    });