Collegamento da un valore di colonna in jqGrid a una nuova pagina utilizzando GET

Ho creato un jqGrid che contiene alcuni campi come:

job_id, nome, ecc

Quello che sto cercando di fare è fare in modo che quando clicchi sul valore nella colonna job_id, lo reindirizzerà a:

job.php? job_id = (valore su cui hanno fatto clic)

Ho iniziato cercando di utilizzare quanto segue come colModel:

{ name:'job_id', index:'job_id', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'job.php'}, width:50, align:'center' } 

Ma ciò che risulta è un reindirizzamento a:

job.php? job_id = (row_id)

Ho fatto alcune ricerche e ho trovato un post dallo sviluppatore della versione open source di questo software che suggeriva di utilizzare il seguente colModel e JS aggiuntivo:

 { name:'job_id', index:'job_id', edittype:'select', formatter:'showlink', formatoptions:{baseLinkUrl:'#'}, width:50, align:'center' } loadComplete: function() { var myGrid = $("#home_list"); var ids = myGrid.getDataIDs(); for (var i = 0, idCount = ids.length; i < idCount; i++) { $("#"+ids[i]+" a",myGrid[0]).click(function(e) { var hash=e.currentTarget.hash;// string like "#?id=0" if (hash.substring(0,5) === '#?id=') { var id = hash.substring(5,hash.length); var text = this.textContent; location.href="job.php?id="+text; } e.preventDefault(); }); } } 

Ma questo non è compatibile con IE. Oltre a questo, quando si visualizza un numero elevato di righe in jqGrid, è necessario un tempo molto lungo per caricare, diciamo 5 secondi + per 500 righe.

Continuerò a lavorare su questo, ma è qualcosa che qualcun altro ha fatto?

Hai usato un esempio di codice dalla mia vecchia risposta, quindi decido che dovrei rispondere alla tua domanda.

Sono d’accordo con il critico loadComplete del codice del loadComplete . Quindi +1 da me per la tua domanda. Il costrutto $("#"+ids[i]+" a", myGrid[0]) all’interno del ciclo lungo può funzionare molto lentamente. Si può facilmente risolvere il problema se si utilizzerà il seguente

 var getColumnIndexByName = function (columnName) { var cm = $(this).jqGrid("getGridParam", "colModel"), l = cm.length, i; for (i = 0; i < l; i++) { if (cm[i].name === columnName) { return i; // return the index } } return -1; }; var myGrid = $("#list"); myGrid.jqGrid({ ... loadComplete: function () { var i = getColumnIndexByName.call(this, 'Subcategory'); // nth-child need 1-based index so we use (i+1) below $("tbody>tr.jqgrow>td:nth-child(" + (i+1) + ")>a", this).click(function (e) { var hash=e.currentTarget.hash;// string like "#?id=0" if (hash.substring(0,5) === '#?id=') { var id = hash.substring(5, hash.length); var text = this.textContent || this.innerText; alert("clicked the row with id='"+id+"'. Link contain '"+text+"'"); location.href = "http://en.wikipedia.org/wiki/" + text; } e.preventDefault(); }); } }); 

Puoi vedere che la versione migliorata della demo funziona esattamente come la demo originale . Per mostrare le prestazioni del metodo su 1000 righe ho creato un’altra demo . Si può vedere che il nuovo metodo funziona rapidamente.

Ora torna al tuo problema principale. Le migliori prestazioni che riceveremo se scriverai il tuo formattatore personalizzato e unformatter invece dell’uso del programma di visualizzazione formattatore predefinito. Il codice può riguardare:

 formatter: function (cellvalue, options, rowObject) { return "" + cellvalue + ""; }, unformat: function (cellvalue, options, cellobject) { return cellobject.job_id; } 

Il codice esatto dipende dal datatype di datatype che utilizzi, indipendentemente dal fatto che tu loadonce:true utilizzando loadonce:true o not e quale jsonReader usi. Ad esempio, rowObject è una matrice nel tuo caso e devi usare l’indice dell’array del campo dati corrispondente (come rowObject[4] ) invece di rowObject.job_id .

AGGIORNATO : Penso che il modo migliore di implementazione sia l’uso di onCellSelect o beforeSelectRow invece di associare l’evento click a ogni elemento della colonna. Raccomando di leggere le seguenti risposte per i dettagli: questa , un’altra e una risposta più vecchia .