2011-02-09 28 views
5

Bien, entonces en pocas palabras, lo que tengo que hacer es aplicar automáticamente un conjunto de criterios de clasificación y filtros de datos al jqGrid cuando se carga. La intención es que el usuario comience con aproximadamente 10 filtros pre-rellenos y luego, si así lo eligen, pueden alterar esos filtros o clasificarlos como mejor les parezca.Necesito ayuda para automatizar los filtros jqGrid, por favor

Hasta ahora, con mucha Google-ción, ensayo y error y el sudor, tengo el siguiente trabajo:

-> puedo cargar/guardar la columna & ordenar sort en una cookie de sesión.

-> Puedo cargar el cuadro de búsqueda con filtros de búsqueda predefinidos. Después de cargar la grilla, puedo abrir el cuadro de diálogo modal y ver los filtros adecuados, y si hago clic en "Buscar", los datos apropiados se publican en el servidor y los resultados correctos vuelven a la pantalla.

Lo que me está mordiendo en el trasero en este momento es, creo, la parte fácil, pero se me escapa. Parece que no puedo hacer ninguno de los siguientes:

(A) Lo ideal sería si pudiera conectar estos filtros a la red y sus datos de publicación antes de la carga inicial para que solo haya un único viaje al servidor

(B) La solución viable, aunque menos ideal, sería que la grilla cargue primero la primera página de los datos no filtrados, luego aplique los filtros y vuelva a consultar el servidor para los datos filtrados.

Como hoy puedo hacer clic manualmente en el botón "Buscar" y funciona, pensé que "B" sería un buen paso siguiente. Por lo tanto, en mi función gridComplete, tengo el siguiente código:

$('#AccountGrid').clearFilter({gridName:'AccountGrid', pagerName:'AccountPager'}); 
    $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:1, op:'ne'}); 
    $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:3, op:'ne'}); 
    // $('#fbox_AccountGrid').searchFilter().search(); 
    // $('#fbox_AccountGrid .ui-search').click(); 
    $('#AccountGrid').trigger('reloadGrid'); 

NOTE: "clearFilter" and "addFilter" are extension functions I have added to jqGrid to simplify adding and removing filters on the grid. They work exactly as desired at this point. 

As you can see with those last three lines of code, I have tried using the built-in function, as well as going after the find button directly and even just forcing the entire grid to refresh. Either way, there is no attempt by the grid to go get new data (I am using Fiddler to watch for it). 

What am I doing wrong in trying to force the grid to reload with the new filters? 

And, if you know how, can you give me some direction on how to get the initial load of the grid to respect these filters? 

TIA 

Tony 


Here is the full grid configuration (minus the extra columns and some colModel "cruft"): 


    jQuery('#AccountGrid').jqGrid({ 
     url: '<my URL>', 
     width: 950, 
     height: 330, 
     shrinkToFit: 'true', 
     datatype: 'json', 
     mtype: 'POST', 
     multiselect: true, 
     multiboxonly: true, 
     multiselectWidth: 20, 
     colNames: [ 
      'Account ID' 
     ], 
     colModel: [ 
      { name: 'AccountID', index: 'AccountID', sortable: false, hidden:false, search:true } 
     ], 
     gridComplete: function() { 
      // add the search criteria to the grid 
      if (initialLoad == true){ 
       $('#AccountGrid').clearFilter({gridName:'AccountGrid', pagerName:'AccountPager'}); 
       $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:1, op:'ne'}); 
       $('#AccountGrid').addFilter({gridName:'AccountGrid', field:'AccountID', data:3, op:'ne'}); 
       // $('#fbox_AccountGrid').searchFilter().search(); 
       // $('#fbox_AccountGrid .ui-search').click(); 
       $('#AccountGrid').trigger('reloadGrid'); 
       initialLoad = false; 
      } 
     }, 
     jsonReader: { 
      repeatitems: false, 
      id: 'AccountID' 
     }, 
     pager: jQuery('#AccountPager'), 
     rowNum: 50, 
     rowList: [10, 15, 25, 50, 75, 100], 
     onSortCol : function (sortname, indexColumn, sortorder){ 
      $.cookie('AccountGrid_sortname', sortname); 
      $.cookie('AccountGrid_sortorder' , sortorder); 
     }, 
     sortname : $.cookie('AccountGrid_sortname') ? $.cookie('AccountGrid_sortname') : 'AccountID', 
     sortorder: $.cookie('AccountGrid_sortorder') ? $.cookie('AccountGrid_sortorder') : 'asc', 
     viewrecords: true, 
     imgpath: '' 
    }); 

    $('#AccountGrid').jqGrid('navGrid','#AccountPager', 
     { view: false, add: false, edit: true, del: false, 
      alertcap:'No Account Selected', 
      alerttext: 'Please select an Account from the grid before performing this operation.', 
      editfunc: showAccountEditDialog }, 
     {}, // default settings for edit 
     {}, // default settings for add 
     {}, // delete 
     {closeOnEscape: true, multipleSearch: true, closeAfterSearch: true }, // search options 
     {} 
    ); 

Y, por la petición, aquí está el código que tengo para añadir/Eliminar filtro:

/* 
    This is a grid extension function that will insert a new filter criteria 
    on the specified grid with the provided field, operation & data values 
*/ 
(function ($) { 
    jQuery.jgrid.addSearchFilter = 
    { 
     // get/set the parameters 
     addFilter: function (options) { 
      var grid = $(this); 
      // get offset values or assign defaults 
      var settings = $.extend({ 
       gridName: '', 
       field: '', 
       data: '', 
       op: '' 
      }, options || {}); 
      // get the column model object from the grid that matches the provided name 
      var colModel = grid.getGridParam('colModel'); 
      var column; 
      for (var i = 0; i < colModel.length; i++) { 
       if (colModel[i].name == options.field){ 
        column = colModel[i]; 
        break; 
       } 
      } 
      colModel = null; 
      if (column){ 
       // if the last filter has a value, we need to create a new one and not overwrite the existing ones 
       if ($('#fbox_' + options.gridName + ' .sf .data input').last().val()){ 
        $('#fbox_' + options.gridName).searchFilter().add(); 
       } 
       // assign the selections to the search dialog 
       $('#fbox_' + options.gridName + ' .sf .fields select.field').last().val(column.index).change(); 
       $('#fbox_' + options.gridName + ' .sf .data input').last().val(options.data); 
       $('#fbox_' + options.gridName + ' .sf .ops select.default').last().val(options.op).change(); 
      } 
     } 
    } 
})(jQuery); 
jQuery.fn.extend({ addFilter: jQuery.jgrid.addSearchFilter.addFilter }); 

/* 
    This is a grid extension function that will clear & reset the filter criteria 
*/ 
(function ($) { 
    jQuery.jgrid.clearSearchFilter = 
    { 
     // get/set the parameters 
     clearFilter: function (options) { 
      var grid = $(this); 
      // get offset values or assign defaults 
      var settings = $.extend({ 
       gridName: '', 
       pagerName: '' 
      }, options || {}); 
      // clear the filters and "pop" the dialog to force the HTML rendering 
      $('#fbox_' + options.gridName).searchFilter().reset(); 
      $('#' + options.pagerName + ' .ui-icon-search').click(); 
      $('#fbox_' + options.gridName).searchFilter().close(); 
     } 
    } 
})(jQuery); 
jQuery.fn.extend({ clearFilter: jQuery.jgrid.clearSearchFilter.clearFilter }); 

Respuesta

4

En primer lugar porque no lleva 't publicar el código que define el jqGrid yo mismo hago algunas suposiciones. Intento basarme en información indirecta de tu pregunta.

1) Supongo que usa el lado del servidor datatype parámetro de jqGrid como 'json' o 'xml'. 2) No usa el parámetro loadonce:true. En general, si sería posible realizar la recarga del servidor desde la cuadrícula con loadonce:true, pero en el caso debe restablecer el valor del parámetro datatype al valor inicial (uno del valor 'json' o 'xml').

El tres siguientes vieja respuesta: this (en caso de single value searching) y this (en caso de advanced searching o the toolbar searching con el parámetro adicional stringResult:true) le dará suficiente información sobre la configuración de los filtros de búsqueda y volver a cargar la rejilla corresponde a los nuevos filtros . Another answer muestra cómo borrar el filtro de búsqueda si ya no es necesario.

La carga de la red por primera vez con los filtros es otra cuestión. Puede ser implementado muy fácilmente. Solo debe usar datatype:"local" en lugar de datatype:"json" o datatype:"xml" que realmente necesita. En el caso, el parámetro url de jqGrid se ignorará en la primera carga y jqGrid no enviará ninguna solicitud al servidor.A continuación, establece los filtros como usted como necesidad y sólo entonces se utiliza $("#youGridId").trigger("reloadGrid");

La razón por la reloadGrid no funcionó en su caso no podía saber con exactitud, pero supongo que no ha definido el parámetro de la search:true jqGrid cuál confunde con frecuencia con la propiedad _search del parámetro postData (consulte here).

+0

Gracias, Oleg. He agregado la definición de la grilla. Originalmente lo había omitido porque la funcionalidad real de definir y asignar los filtros de búsqueda funcionaba bien y si hacía clic en el botón "buscar" manualmente, funcionaba como se esperaba, así que de esa información supuse que mi cuadrícula estaba configurada correctamente. Pero tienes razón, debería haberlo incluido independientemente. – Tony

+0

Algunos de los enlaces que proporcionó, que había visto, y algunos que no. Sin embargo, cuando los miro, se enfocan en cómo hacer que la búsqueda funcione. Esa parte, la parte difícil, ya lo hice. Es solo la recarga de la grilla y/o la precarga de los criterios de búsqueda que no he podido identificar. Su sugerencia de establecer el tipo de datos, luego los filtros y restablecer el tipo de datos es interesante. Voy a intentarlo esta mañana. – Tony

+0

Intenté su sugerencia de establecer primero el tipo de datos en "local" y luego aplicar los filtros y restablecer el tipo de datos a "json" y luego llamar a la grilla de recarga. El primer problema es que los filtros no se aplican a la red cuando la red está en ese modo. Aún no lo he comprobado, pero o bien no puede aplicar los filtros cuando el tipo de datos es "local" o al cambiar el tipo de datos borra los filtros. A pesar de todo, el segundo problema es que cuando utilizo Fiddler para ver las solicitudes del navegador, la grilla nunca vuelve a llamar al servidor para obtener datos, incluso después de configurar el tipo de datos en json y volver a cargar la grilla. – Tony

Cuestiones relacionadas