Filtros por rangos de fechas con FilterZen – Paso a paso

Hace un tiempo había mencionado el producto FilterZen (no es gratis) para habilitar filtros por rangos de fechas en nuestras listas en SharePoint 2007 en este post. Hoy vamos a ver un paso a paso para instalar una webpart de filtro por rangos de fechas. Esta funcionalidad es parte de la licencia Ultimate, que pueden ver en: http://roxority.com/filterzen-license/. Espero les resulte útil.

 

Paso 1: instalación

Descargamos el productos desde http://d2xb0ojpdnuh0h.cloudfront.net/roxority_FilterZen.zip y lo instalamos en el servidor de SharePoint. Podemos elegir la colección correspondiente.

 

Paso 2: configuración

A continuación vamos a enumerar los pasos para configurar un filtro por rango de fechas típico en donde queremos buscar aquellos elementos cuya fecha se encuentre en un rango. Para ello seguimos el siguiente instructivo: http://roxority.com/sharepoint-zen/sharepoint-value-range-filtering-the-new-simplified-way.html.

2.1 Agregar la webpart

El primer paso es agregar la webpart:

Una vez agregada, la misma aparecerá en este estado:

2.2 Conectar la webpart

Conectamos las webparts usando la opción “Send Filter Valurs To”:

2.3 Activar el modo CAML

Luego activamos la opción CAML Direct filtering mode:

Presionamos Aplicar y la webpart se verá de esta forma:

2.4 Agregar un filtro

En All Filters seleccionamos la columna por la que queremos filtrar y luego presionamos el botón “+”:

Luego, en opciones avanzadas seleccionamos la opción “range: >= x and <= y”:

2.5 Aplicar los cambios

Finalmente, aplicamos los cambios:

Y aplicamos las propiedades de la webpart. Obtendremos una webpart como la siguiente:

 

Paso 3: agregar más filtros

Para agregar más filtros, simplemente repetimos a partir del paso 2.4.

Y obtendremos algo como lo siguiente:

 

Paso 4: modificar los estilos

La modificación de estilos es muy sencilla, ya que puede ser realizada con CSS. Por ejemplo:

.rox-ifilter-all {
    background: none !important;
    border-color: #C1C3C5 !important;
}

.rox-ifilter-label {
    color: black !important;
}

.rox-filter-button {
    height: 23px;
    width: 66px;
}

En caso que quieran cambiar el texto del botón de filtrado, un método muy sencillo es usar jQuery:

$(".rox-filter-button").text('Filtrar');

Y así obtendrán algo como lo siguiente: