2010-08-25 18 views
9

Tengo un JQGrid con loadonce: verdadero (así que todo es del lado del cliente) y paginación habilitada (con, digamos 20 páginas).JQGrid Programemente selecciona cuadrícula Fila

Me gustaría especificar una fila (programáticamente, sin la entrada del usuario) y hacer que mi cuadrícula navegue a la página correspondiente para seleccionar la fila especificada.

¿Esto es posible con el JQGrid actual?

He buscado en la búsqueda y el filtro, pero eso solo vuelve a cargar la cuadrícula con nuevas filas - Necesito que mi cuadrícula navegue a la página correcta - Manteniendo sus datos y estructura.

Estoy en el proceso de optimizar la estructura de mi grilla, por lo que cualquier cambio necesario (por ejemplo del lado del cliente al lado del servidor) sería posible.

+0

Tengo una idea de cómo lograr esto, pero aún me gustaría saber si hay un camino integrado. Mi idea: 1. a = Obtenga el número total de elementos por buscapersonas. 2. b = Obtenga elementos totales en la cuadrícula/a 3. Navegue a la página b 4. seleccione el elemento con la identificación predefinida. – Bob

+0

¿Has probado lo mismo que sugerí con la cuadrícula de árbol? Funciona todo sin ninguna solicitud al servidor (en el caso de 'loadonce: true')? – Oleg

+0

@Oleg: ¡Hola! Implementaré tus sugerencias en los próximos días. Actualmente estoy corrigiendo errores para mi lanzamiento hoy. – Bob

Respuesta

17

Como usa loadonce:true, prepara los datos en el servidor. En el lado del servidor, puede decidir qué fila debe seleccionarse. En el lado del servidor también puede calcular fácilmente en qué página será la fila seleccionada. La identificación de la fila seleccionada y la página seleccionada puede, por ejemplo, incluir como parte de userdata. Por lo que los datos enviados desde el servidor podría parece siguiente:

{ 
    "total": 5, 
    "page": 1, 
    "records": 107, 
    "rows": [ 
     ... 
    ], 
    "userdata": { 
     "page": 3, 
     "selId": 24 
    } 
} 

Dentro de loadComplete que puede hacer acerca de seguir

loadComplete: function(data) { 
    if (jQuery("#list").getGridParam('datatype') === "json") { 
     // data.userdata is the same as jQuery("#list").getGridParam('userData'); 
     var userdata = jQuery("#list").getGridParam('userData'); 
     var curPage = jQuery("#list").getGridParam('page'); // is always 1 
     if (curPage !== userdata.page) { 
      setTimeout(function(){ 
       jQuery("#list").setGridParam(
        { page: userdata.page }).trigger("reloadGrid"); 
       jQuery("#list").setSelection (userdata.selId, true); 
      },100); 
     } 
     else { 
      jQuery("#list").setSelection (userdata.selId, true); 
     } 
    } 
} 

A ejemplos de trabajo se puede ver en http://www.ok-soft-gmbh.com/jqGrid/DataToSelect.htm y http://www.ok-soft-gmbh.com/jqGrid/DataToMultiSelect.htm.

ACTUALIZACIÓN: Free jqGrid apoya multiPageSelection:true opción strarting con la versión 4.10.0. La opción permite establecer la selección de múltiples filas en la cuadrícula muy fácilmente (y funciona muy rápido, porque establece el estado de selección directamente durante la creación del cuerpo de la cuadrícula). Consulte the answer y the demo y the readme to 4.10.0.

+0

Gracias como siempre Oleg! ¿Este método me obligaría a recrear la grilla en el servidor cada vez que quisiera navegar a una página diferente? Mi programa tiene un árbol y la grilla. cuando un usuario selecciona un elemento en el árbol, la grilla buscará ese elemento y lo seleccionará en la grilla. – Bob

+1

¡Hola! Como usa 'loadonce: true' solo la primera carga será del servidor. Pruebo 'getGridParam ('datatype') ===" json "' en 'loadComplete' porque jqGrid cambia a' "local" 'y en la próxima actualización (paginación, clasificación, filtrado/búsqueda) todo funciona localmente sin servidor. Con las cuadrículas de árbol no tengo experiencia, pero debido a que tiene la misma API jqGrid, todas también deberían funcionar o se puede hacer una modificación de código correspondiente basada en la misma idea. – Oleg

+0

¡Hola Oleg! ¡Implementé mi función de selección según sus consejos y funciona perfectamente! Gracias. Lo he alterado un poco, ya que los datos de mi tabla nunca cambian. Al cargar, almacené una lista json de todas mis filas y sus ID correspondientes.Al seleccionar el nodo de árbol, busco el número de página del nodo y lo selecciono en la cuadrícula. – Bob

Cuestiones relacionadas