Me parece muy interesante su pregunta, así que preparé the demo que demuestran cómo se puede combinar el diálogo Advanced Searching y Toolbar Searching en una cuadrícula.
Un truco importante, pero simple es el uso de recreateFilter: true. Por defecto, el diálogo de búsqueda se creará una vez y luego solo se ocultará o se mostrará. Como resultado, el parámetro postData.filters no se actualizará. Después de configurar recreateFilter: true se resolverá el problema con el llenado del diálogo de búsqueda avanzada con los valores de la barra de herramientas de búsqueda. Yo personalmente puse las opciones de búsqueda por defecto como la siguiente
$.extend(
$.jgrid.search,
{
multipleSearch: true,
multipleGroup: true,
recreateFilter: true,
overlay: 0
}
);
ahora a la parte más compleja de la solución es la función refreshSerchingToolbar que escribí. La función no es tan simple, pero es simplemente en uso:
loadComplete: function() {
refreshSerchingToolbar($(this), 'cn');
}
El último parámetro es el mismo parámetro que utilizaste como defaultSearch propiedad del método de la barra de herramientas de búsqueda filterToolbar (el valor por defecto es 'pc', pero yo personalmente prefiero usar 'cn' y establecer el parámetro jqGrid ignoreCase: true).
Si se llena el cuadro de diálogo de búsqueda avanzada en the demo con el siguiente campo
y hace clic en el botón "Buscar", que tendrá la siguiente tabla:
(Marqué la columna 'Total' como no buscable con respecto a search: false para mostrar solo que todo funciona correctamente en el caso también)
Se puede ver que todos los campos de la barra de herramientas de búsqueda excepto "Cantidad" se rellenan con los valores del cuadro de diálogo de búsqueda. El campo no se llena porque utilizamos la operación "rallador o igual" en lugar de "igual". La función refreshSerchingToolbar llena sólo los elementos de la barra de herramientas de búsqueda que puede ser producido por el
Así como un recordatorio debería mencionar que en el caso del uso de Filter Toolbar es muy importante definir searchoptions.sopt opciones del colModel. Para todas las columnas que no sean cadenas contiene (fechas, números, selecciones, int, moneda) es extremadamente importante tener 'eq' como el primer elemento de la matriz sopt. Vea here y here para más detalles.
Si cambia el filtro del diálogo avanzado a la siguiente
tendrá que esperar
Al final incluyo el código de la función refreshSerchingToolbar :
var getColumnIndex = function (grid, columnIndex) {
var cm = grid.jqGrid('getGridParam', 'colModel'), i = 0, l = cm.length;
for (; i < l; i += 1) {
if ((cm[i].index || cm[i].name) === columnIndex) {
return i; // return the colModel index
}
}
return -1;
},
refreshSerchingToolbar = function ($grid, myDefaultSearch) {
var postData = $grid.jqGrid('getGridParam', 'postData'), filters, i, l,
rules, rule, iCol, cm = $grid.jqGrid('getGridParam', 'colModel'),
cmi, control, tagName;
for (i = 0, l = cm.length; i < l; i += 1) {
control = $("#gs_" + $.jgrid.jqID(cm[i].name));
if (control.length > 0) {
tagName = control[0].tagName.toUpperCase();
if (tagName === "SELECT") { // && cmi.stype === "select"
control.find("option[value='']")
.attr('selected', 'selected');
} else if (tagName === "INPUT") {
control.val('');
}
}
}
if (typeof (postData.filters) === "string" &&
typeof ($grid[0].ftoolbar) === "boolean" && $grid[0].ftoolbar) {
filters = $.parseJSON(postData.filters);
if (filters && filters.groupOp === "AND" && typeof (filters.groups) === "undefined") {
// only in case of advance searching without grouping we import filters in the
// searching toolbar
rules = filters.rules;
for (i = 0, l = rules.length; i < l; i += 1) {
rule = rules[i];
iCol = getColumnIndex($grid, rule.field);
cmi = cm[iCol];
control = $("#gs_" + $.jgrid.jqID(cmi.name));
if (iCol >= 0 && control.length > 0) {
tagName = control[0].tagName.toUpperCase();
if (((typeof (cmi.searchoptions) === "undefined" ||
typeof (cmi.searchoptions.sopt) === "undefined")
&& rule.op === myDefaultSearch) ||
(typeof (cmi.searchoptions) === "object" &&
$.isArray(cmi.searchoptions.sopt) &&
cmi.searchoptions.sopt[0] === rule.op)) {
if (tagName === "SELECT") { // && cmi.stype === "select"
control.find("option[value='" + $.jgrid.jqID(rule.data) + "']")
.attr('selected', 'selected');
} else if (tagName === "INPUT") {
control.val(rule.data);
}
}
}
}
}
}
};
ACTUALIZADO: El código anterior ya no es necesario en caso de uso free jqGrid 4.13.1 o superior. Contiene la nueva opción por defecto del loadFilterDefaults: truefilterToolbar, que actualiza los valores de la barra de herramientas de filtro y las operaciones de filtro (si se ralizar searchOperators: true opción de filterToolbar) si se ha armado postData.filters y search: true (se aplica el filtro). El jqGrid gratuito actualiza la barra de herramientas de filtro en jqGridAfterLoadComplete (si loadFilterDefaults: true están configurados) o si el evento jqGridRefreshFilterValues está explícitamente activado.
@itsmatt: ¿Es esto lo que necesita? – Oleg
Eso es bastante completo, Oleg. ¡Agradezco la profundidad de tu respuesta! – itsmatt
Una de las complicaciones que tengo con el filtrado de fechas es que tal vez quiera filtrar el nivel mensual y hasta ahora he resuelto esto usando GT (mayor que) como mi operador, así que si quería ver los datos de junio podría filtrar a GT 1 de junio de 2011 y aunque no es ideal, me da todos los datos de junio (junto con, como efecto secundario, los datos de julio también). Sin embargo, eso es solo un ajuste en el selector de fechas, necesito ver eso, entonces el ecualizador funcionaría bien, supongo. – itsmatt