2011-06-28 16 views
6

me gusta la funcionalidad del filtro en este ejemplo:Combinando ejemplos de filtros SlickGrid

http://mleibman.github.com/SlickGrid/examples/example-header-row.html

donde cada columna tiene su propio filtro, pero también requiere la funcionalidad del filtro de:

http://mleibman.github.com/SlickGrid/examples/example4-model.html

En que se puede ocultar y se muestra con un clic de botón.

¿Es posible tener los filtros del primer enlace, con la "ocultación" del filtro del segundo enlace? ¡Gracias!

Respuesta

7

Sí, lo es. Es posible utilizar el método grid.hideHeaderRowColumns() en el primer ejemplo para ocultar la barra de filtro. A continuación, utilice grid.showHeaderRowColumns() para mostrar de nuevo.

Por ejemplo, vaya al primer enlace, y sustituir el contenido de la barra de URL con:

javascript:grid.hideHeaderRowColumns() 

y pulsa enter. Debería ver la diapositiva barra de filtro hacia arriba y lejos. Si está creando su aplicación desde el primer código de ejemplo, debería poder llamar a estas funciones desde casi cualquier lugar, es decir.

<input type="button" onclick="grid.hideHeaderRowColumns();" value="Hide Filter" /> 

Tenga en cuenta que en el segundo ejemplo, el autor utiliza el código siguiente para agregar un elemento predefinido, pero oculto a la barra de encabezado de estilo:

// move the filter panel defined in a hidden div into grid top panel 
$("#inlineFilterPanel") 
    .appendTo(grid.getTopPanel()) 
    .show(); 

Y el elemento oculto:

<div id="inlineFilterPanel" 
     style="display:none;background:#dddddd;padding:3px;color:black;"> 
    Show tasks with title including 
     <input type="text" id="txtSearch2"> 
    and % at least &nbsp; 
     <div style="width:100px;display:inline-block;" id="pcSlider2"></div> 
</div>