perché la colonna congelata di Jqgrid non sembra funzionare con le righe dei filtri e l’intestazione del filtro?

Non riesco a far funzionare le colonne bloccate con jqgrid (4.3.0). l’unica cosa che posso pensare è che ho alcune cose specifiche che non sono fuori dalla scatola:

  1. Sto usando una riga filtrata in alto.
  2. Sto mostrando tutti i pulsanti nella parte superiore della griglia usando (cloneToTop: true)
  3. Ho il seguente codice che uso per mostrare lo stato del filtro nella parte superiore di jqggrid. (usando filtertoolbar)

    loadComplete: function () { var postData = jQuery(gridSelector).getGridParam("postData"); var newCapture = ""; if (postData._search === true && typeof postData.filters !== "undefined") { var filters = jQuery.parseJSON(postData.filters); newCapture = "Filter: ["; var rules = filters.rules; for (var i = 0; i < rules.length; i++) { var rule = rules[i]; var op = rule.op; // the code name of the operation if (jQuery.fn.searchFilter && jQuery.fn.searchFilter.defaults && jQuery.fn.searchFilter.defaults.operators) { // find op description var operators = jQuery.fn.searchFilter.defaults.operators; for (var j = 0; j < operators.length; j++) { if (operators[j].op === rule.op) { op = operators[j].text; //op = $.jgrid.search.odata[j]; break; } } } newCapture += rule.field + " " + op + " '" + rule.data + "'"; if (i + 1 !== rules.length) newCapture += ", "; } newCapture += "]"; } jQuery(gridSelector).setCaption(newCapture); 

qualcuno può pensare a qualcosa che possa impedire alle colonne congelate di funzionare in queste circostanze.

Ho analizzato il tuo problema e creato la demo che dimostra come il problema può essere risolto. La demo produce la griglia con la prima colonna congelata:

inserisci la descrizione dell'immagine qui

Ho trovato alcuni bug nell’implementazione corrente (versione 4.3.1) delle colonne congelate in jqGrid e pubblicherò in seguito i miei suggerimenti su come correggerli in trirand. I problemi sono i seguenti:

Uno può vedere il primo problema particolarmente chiaro in caso di datatype: 'local' di datatype: 'local' cui i dati della griglia verranno riempiti durante l’inizializzazione della griglia. Guarda la demo corrispondente in cui ho appena chiamato il metodo setFrozenColumns . Si può vedere il problema sull’immagine

inserisci la descrizione dell'immagine qui

Si può vedere che solo l’intestazione della colonna verrà congelata, ma il corpo della griglia includendo la colonna con i numeri di riga verrà fatto scorrere. Come si può vedere dalla prossima demo sarà sufficiente chiamare il metodo _complete subito dopo aver chiamato setFrozenColumns per risolvere il problema:

 $grid.jqGrid('setFrozenColumns'); $grid[0].p._complete.call($grid[0]); 

dove $grid è definita come var $grid = $('#list'); .

Il prossimo problema è che il metodo _complete calcola la posizione della parte fissa dell’intestazione della colonna (salvata in $grid[0].grid.fhDiv ) e la parte fissa del corpo della griglia (salvata in $grid[0].grid.fbDiv ) usando solo l’altezza della didascalia della griglia standard (titolo della griglia). Quindi se usi setCaption per modificare la didascalia puoi avere immersioni “congelate” nella posizione sbagliata. La chiamata del metodo _complete dopo setCaption non risolverà il problema e uno avrà ancora i risultati come nella demo :

inserisci la descrizione dell'immagine qui

Per risolvere il problema ho scritto la funzione molto semplice fixPositionsOfFrozenDivs

 var fixPositionsOfFrozenDivs = function () { if (typeof this.grid.fbDiv !== "undefined") { $(this.grid.fbDiv).css($(this.grid.bDiv).position()); } if (typeof this.grid.fhDiv !== "undefined") { $(this.grid.fhDiv).css($(this.grid.hDiv).position()); } }; 

che fissa la posizione delle immersioni ghiacciate.

Alla fine ho modificato leggermente l’implementazione di loadComplete al seguente:

 loadComplete: function () { var $this = $(this), newCapture = "", filters, rules, rule, op, i, iOp, postData = $this.jqGrid("getGridParam", "postData"), isFiltering = $this.jqGrid("getGridParam", "search"); if (isFiltering === true && typeof postData.filters !== "undefined") { filters = $.parseJSON(postData.filters); newCapture = "Filter: ["; rules = filters.rules; for (i = 0; i < rules.length; i++) { rule = rules[i]; op = rule.op; // the code name of the operation iOp = $.inArray(op, arOps); if (iOp >= 0 && typeof $.jgrid.search.odata[iOp] !== "undefined") { op = $.jgrid.search.odata[iOp]; } newCapture += rule.field + " " + op + " '" + rule.data + "'"; if (i + 1 !== rules.length) { newCapture += ", "; } } newCapture += "]"; } $this.jqGrid("setCaption", newCapture); fixPositionsOfFrozenDivs.call(this); } 

dove l’array arOps è definito come

 var arOps = ["eq", "ne", "lt", "le", "gt", "ge", "bw", "bn", "in", "ni", "ew", "en", "cn", "nc"]; 

Come risultato si avrà la demo a cui ho fatto riferimento all’inizio della mia risposta. Se si digita un filtro nella barra degli strumenti del filtro di ricerca o nella finestra di ricerca avanzata, la didascalia della griglia verrà modificata (come nell’esempio originale), ma tutte le immersioni congelate avranno la posizione corretta.