¿Es posible modificar el colModel después de que los datos se hayan cargado con jqgrid?

Tengo un jqGrid donde necesito cambiar el modelo después de cargar los datos, pero antes de que se analice en la cuadrícula. En otras palabras, creo que quiero hacerlo en el controlador loadComplete. Veo este enfoque: Establecer colName de JqGrid y colModel a partir de datos JSON , pero ya tengo un montón de grillas que utilizan el enfoque “cargar datos con jqGrid”, en lugar de “cargar datos previamente y pasarlos a jqGrid” uno usado allí, y espero evitar volver a codificar o hacer que este sea diferente.

(Ocultar y mostrar columnas ocultas tampoco es práctico).

es posible?

Más detalles:

Básicamente, no sé qué columnas necesito hasta que veo los datos. Supongamos que estoy mostrando el tráfico por estado:

Date CA WA NY MN 4/20 100 90 85 72 4/21 95 85 89 70 

Solo hay espacio para mostrar cuatro estados, pero puede haber muchos más en los datos (o puede haber menos), por lo que quiero que aparezcan en orden de tráfico. En este momento, los datos vienen como:

 { date : 4-20, ca : 100, wa : 90, ny : 85, mn : 72 hi : 56, il : 30 }, { date : 4-21, ca : 95, wa : 85, // note: for a given row, a column might be relatively lower ny : 89, // than another. The column order is based on the overall mn : 70 hi : 60, il : 45 } 

o podría ser:

 { date : 4-20, ny : 110, hi : 95, il : 90, wa : 80 } 

Intenté configurar columnas como state1, state2, state3, state4 y luego usando jsonmap para reasignarlas, pero no funcionó.

loadonce = true, datatype = json

Encontré una manera que parece funcionar bien.

La idea de mi solución es seguir. Utiliza colModel con muchas columnas ocultas con los nombres ficticios como ‘cm0’, ‘cm1’, ‘cm2’, … Todas las columnas tienen los mismos datos que necesita en su caso. Para llenar los datos más fácilmente, utilizo plantillas de columnas existentes desde jqGrid 3.8.2:

 var mygrid=jQuery("#list"), cmIntTemplate = { width:50, sorttype:"int", formatter:"integer", align:"right", hidden:true }, cm = [ // here we define the first columns which we always has // the list can be empty or has some columns with // the properties other as the rest (without cmIntTemplate) {name:"date",label:"Date",key:true,width:100, fixed:true, formatter:'date',formatoptions:{srcformat:"md",newformat:"m/d"}} ], maxCol = 30, dummyColumnNamePrefix = "cm"; // Add dummy hidden columns. All the columns has the same template for (i=0;i 

Después de eso creo jqGrid de la manera estándar, pero con el jsonReader que usa la page como función :

 jsonReader: { repeatitems: false, page: function (obj) { // ------------------------ // here I add the main code // ------------------------ return obj.page; } } 

La función de jsonReader.page devuelve el mismo valor como el valor predeterminado de jsonReader , pero utilizo el modo con función porque la función se jsonReader directamente antes de la lectura del contenido principal de JSON. Dentro del código, obtengo la primera fila de los datos y uso sus nombres de propiedad para completar la propiedad jsonmap de la columna correspondiente y establecer el nombre de la columna. Además, creo algunas columnas ficticias necesarias para mostrar todos los datos JSON visibles y el rest de la columna ficticia oculta. Lo último que se debe hacer es corregir el ancho de la cuadrícula que se calculó previamente. Entonces la grilla se verá así:

enter image description here

o así

enter image description here

Depende de los datos de entrada JSON.

El código de la función de page es el siguiente:

 page: function (obj) { var rows = obj.rows, colModel = mygrid[0].p.colModel, cmi, iFirstDummy, firstRow, prop, orgShrinkToFit, isFound, showColNames = [], hideColNames = []; if (typeof(rows) === "undefined" || !$.isArray(rows) || rows.length === 0) { // something wrong need return return obj.page; } // find the index of the first dummy column // in the colModel. If we use rownumbers:true, // multiselect:true or subGrid:true additional // columns will be inserted at the begining // of the colModel iFirstDummy = -1; for(i=0;i 

Dentro de la función de page uso pequeñas funciones auxiliares

 var clearShrinkToFit = function() { // save the original value of shrinkToFit var orgShrinkToFit = mygrid.jqGrid('getGridParam','shrinkToFit'); // set shrinkToFit:false to prevent shrinking // the grid columns after its showing or hiding mygrid.jqGrid('setGridParam',{shrinkToFit:false}); return orgShrinkToFit; }, setGridWidthAndRestoreShrinkToFit = function(orgShrinkToFit) { // calculate the new grid width var width=0, i=0, headers=mygrid[0].grid.headers, l=headers.length; for (;i 

La demostración funcional que puedes ver aquí .

ACTUALIZADO : Otra respuesta con la demostración muestra cómo crear la grilla que tiene otro formato de datos de entrada: [[], [], ...] (matriz de matrices) - matriz.