Rappelez-vous (persistez) le filtre, l’ordre de sorting et la page actuelle de jqGrid

Les utilisateurs de mon application ont demandé s’il était possible pour les pages contenant un jqGrid de se souvenir du filtre, de l’ordre de sorting et de la page actuelle de la grid (car, lorsqu’ils cliquent sur un élément de la grid pour exécuter une tâche, puis y reviennent, il le souhaite. ce soit “comme ils l’ont laissé”)

Les cookies semblent être la voie à suivre, mais comment faire en sorte que la page les charge et les insère dans la grid avant de faire sa première demande de données me dépasse un peu à ce stade.

Quelqu’un at-il une expérience avec ce genre de chose avec jqGrid? Merci!

    PROBLÈME RÉSOLU

    J’ai finalement fini par utiliser des cookies en javascript pour stocker la colonne de sorting, l’ordre de sorting, le numéro de page, les lignes de grid et les détails de filtrage de la grid (en utilisant les cookies JSON / Javascript – l’object prefs )

    Enregistrer les préférences – Appelé à partir de $(window).unload(function(){ ... });

     var filters = { fromDate: $('#fromDateFilter').val(), toDate: $('#toDateFilter').val(), customer: $('#customerFilter').val() }; prefs.data = { filter: filters, scol: $('#list').jqGrid('getGridParam', 'sortname'), sord: $('#list').jqGrid('getGridParam', 'sortorder'), page: $('#list').jqGrid('getGridParam', 'page'), rows: $('#list').jqGrid('getGridParam', 'rowNum') }; prefs.save(); 

    Charger les préférences – Appelé à partir de $(document).ready(function(){ ... });

     var gridprefs = prefs.load(); $('#fromDateFilter').val(gridprefs.filter.fromDate); $('#toDateFilter').val(gridprefs.filter.toDate); $('#customerFilter').val(gridprefs.filter.customer); $('#list').jqGrid('setGridParam', { sortname: gridprefs.scol, sortorder: gridprefs.sord, page: gridprefs.page, rowNum: gridprefs.rows }); // filterGrid method loads the jqGrid postdata with search criteria and re-requests its data filterGrid(); 

    Référence jqGrid: http://www.secondpersonplural.ca/jqgriddocs/_2eb0fi5wo.htm

    PAR DEMANDE POPULAIRE – LE CODE FILTERGRID

      function filterGrid() { var fields = ""; var dateFrom = $('#dateFrom').val(); var dateTo = $('#dateTo').val(); if (dateFrom != "") fields += (fields.length == 0 ? "" : ",") + createField("shipmentDate", "ge", dateFrom); if (dateTo != "") fields += (fields.length == 0 ? "" : ",") + createField("shipmentDate", "le", dateTo); var filters = '"{\"groupOp\":\"AND\",\"rules\":[' + fields + ']}"'; if (fields.length == 0) { $("#list").jqGrid('setGridParam', { search: false, postData: { "filters": ""} }).sortinggger("reloadGrid"); } else { $("#list").jqGrid('setGridParam', { search: true, postData: { "filters": filters} }).sortinggger("reloadGrid"); } } function createField(name, op, data) { var field = '{\"field\":\"' + name + '\",\"op\":\"' + op + '\",\"data\":\"' + data + '\"}'; return field; } 

    Je travaillais sur la même chose mais j’avais également besoin de récupérer et de sauvegarder le classement des colonnes. Ce n’est pas simple, car jqGrid.remapColumns est relatif à l’état actuel de la grid de la grid …

    Juste au cas où quelqu’un trouverait cela utile (et j’aimerais savoir s’il y a déjà quelque chose à faire qui me manque):

     (function($){ $.jgrid.extend({ getColumnOrder : function () { var $grid = $(this); var colModel = $grid[0].p.colModel; var names = []; $.each(colModel, function(i,n){ var name = this.name; if (name != "" && name != 'subgrid') names[names.length] = name; }); return names; //return JSON.ssortingngify(names); //$('#dbgout').val(j); }, setColumnOrder : function (new_order) { var $grid = $(this); //var new_order = JSON.parse($('#dbgout').val()); //new_order = ['a', 'c', 'd', 'b', 'e']; // 0 1 2 3 4 var new_order_index = {}; $.each(new_order, function(i,n){ new_order_index[n] = i; }); //new_order = ['a', 'c', 'd', 'b', 'e']; // 0 1 2 3 4 // new_order_index a=>0 c=>1 d=>2 b=>3 e=>4 var colModel = $grid[0].p.colModel; cur = []; $.each(colModel, function(i,n){ var name = this.name; if (name != "" && name != 'subgrid') cur[cur.length] = name; }); //cur = ['a', 'b', 'c', 'd', 'e']; // 0 1 2 3 4 cur_index = {}; $.each(cur, function(i,n){ cur_index[n] = i; }); // remapColumns: The indexes of the permutation array are the current order, the values are the new order. // new_order 0=>a 1=>c 2=>d 3=>b 4=>e // new_order_index a=>0 c=>1 d=>2 b=>3 e=>4 // cur 0=>a 1=>b 2=>c 3=>d 4=>e // cur_index a=>0 b=>1 c=>2 d=>3 e=>4 // permutati 0 2 3 1 4 // acdbe var perm = []; $.each(cur, function(i, name){ // 2=>b new_item = new_order[i]; // c goes here new_item_index = cur_index[new_item]; perm[i] = new_item_index; }); if (colModel[0].name == 'subgrid' || colModel[0].name == '') { perm.splice(0, 0, 0); $.each(perm, function(i,n){ ++perm[i] }); perm[0] = 0; } $grid.jqGrid("remapColumns", perm, true, false); }, }); })(jQuery); 

    Je fais partie de ce que vous avez besoin de mettre en œuvre en ce qui concerne jqGridExport et jqGridImport (voir http://www.sortingrand.com/jqgridwiki/doku.php?id=wiki:import_methods ), mais il me semble que vous en voulez davantage existe hors de la boîte dans jqGrid. Quelques fonctionnalités supplémentaires que vous devrez implémenter vous-même.

    Si l’utilisateur se connecte, vous pourrez peut-être envoyer des requêtes AJAX au serveur lorsque ces parameters seront modifiés. Vous pouvez ensuite enregistrer les parameters dans la firebase database (pour les rendre permanentes), dans la session (pour les conserver temporairement) ou les deux (pour des raisons de performances).

    Dans tous les cas, avec les parameters stockés côté serveur, vous pouvez simplement les envoyer à la page lorsque celle-ci est demandée.

    Bonjour, Vous pouvez rendre cela plus facile (aucune autre dépendance nécessaire) dans Pure Js et non dans un plugin jQuery

     var prefs = { data: {}, load: function () { var the_cookie = document.cookie.split(';'); if (the_cookie[0]) { this.data = JSON.parse(unescape(the_cookie[0])); } return this.data; }, save: function (expires, path) { var d = expires || new Date(2020, 02, 02); var p = path || '/'; document.cookie = escape( JSON.ssortingngify(this.data) ) + ';path=' + p + ';expires=' + d.toUTCSsortingng(); } } 

    Comment utiliser ?

     to_save = { "size": 40, "color": "green", "products":"jeans"};//and any other data/filters you wanna store here prefs.data = to_save; prefs.save();//now our json object is saved on the client document cookie // delete var date_in_the_past = new Date(2000,02,02); prefs.save(date_in_the_past); // read var what = prefs.load(); // load populates prefs.data and also returns alert(what.color); // or ... alert(prefs.data.color); 

    PS: tous les navigateurs modernes prennent en charge le codage / décodage JSON natif (Internet Explorer 8+, Firefox 3.1+, Safari 4+ et Chrome 3+). En gros, JSON.parse (str), lisez plus . PSS: l’object que j’ai utilisé n’est qu’optimisation et suppression de la dépendance de .toJSONssortingng … source

    Jetez un coup d’oeil à ces plugins jQuery

    N’utilisez pas la fonction personnalisée ci-dessus https://github.com/carhartl/jquery-cookie

    https://github.com/ScottHamper/Cookies