top of page
Control dinámico de la Visibilidad de Columnas en Rejillas ...
Ramiro Pérez Acebo -Septiembre 2014
 
 

En ocasiones es interesante que el usuario pueda controlar las columnas a mostrar en una rejilla para adaptarlas a sus intereses o a la resolución de la pantalla. En este artículo se describe una forma genérica de conseguir este objetivo...

 

Para lograrlo hemos de incorporar en la rejilla los siguientes elementos:

 

1.  Una opción de la Toolbar que dispare una señal (por ejemplo, la última por la derecha)

2.  Una conexión de evento (2º de la imagen) que capture esa señal y lance un manejador

3.   Un grupo de variables definidas en la propia Rejilla. Puesto que el propósito fundamental es ocultar Columnas, todas comienzan por el identificador "HIDE"

4.   Aplicar como condición de visibilidad de cada columna de la Rejilla el valor de la matriz HIDE en la posición que la columna ocupa en la rejilla (inicio en 1). 

5.    Un manejador de evento (JavaScript) que lea las columnas de la rejilla 

6.  Un manejador de evento que haga la mayor parte del trabajo que pretendemos. En concreto se encargará de:

 

  • Lanzar el manejador Js que lee las columnas de la rejilla

  • Solicitar la presentación del Formulario de selección de columnas a visualizar

  • Comprobar si fue aceptado y en su caso pasar a la matriz de variables HIDE las condiciones de visibilidad seleccionadas

  • Aplicar las condiciones de columnas "siempre visibles" ó "siempre ocultas" establecidas para la rejilla

  • Forzar el refresco de la rejilla asignándole una variable (HIDE_A_PC) que se usa en el pie en la primera columna (ver siguiente imagen)

7.  Y finalmente un manejador de evento (que normalmente se lanzará desde otro manejador, ON_SHOW, asociado a su vez a la conexión On Show). En este manejador se leerá la configuración particular de columnas para el usuario así como las Columnas "siempre visibles" y "siempre ocultas"

Todos estos elementos son exactamente iguales para cualquiera de las Rejillas en donde queramos implementar la selección de Columnas, por lo que bastaría con crearlos para una de ellas y copiarlos en el resto de rejillas. Como complemento a este trabajo (de copiar y pegar), en cada rejilla tendríamos que hacer (y esto es más laborioso) las siguientes tareas:

 

(1)        Definir manualmente la condición de visibilidad ( HIDE [ nn ] = 0 ) de cada columna

(2)        Incorporar la variable HIDE_A_PC1 en el pié de la primera columna.

 

(1**)      Tal vez con JavaScript se pueda asignar dinámicamente la condición de visibilidad de las columnas de una rejilla, pero eso desborda mi conocimiento actual de JavaScript y dada la calidad de la documentación disponible, mejor no me pongo con ello porque en Septiembre me gustaría poder hacer alguna otra cosa. Agradecería vuestra ayuda en este punto...

También necesitaremos un Formulario para la selección de Columnas:

 

El formulario será el mismo para todas las rejillas y por tanto su origen podrá ser nulo o de alguna Tabla auxiliar. Su tamaño inicial será pequeño para que no parezca desmesurado si las columnas a seleccionar son pocas. Mi diseño admite la selección de hasta 60 columnas pero es sencillo ampliarlo...

Es más clara la previsualización. Los textos son partes de la variable (recibida como parámetro) con los nombres de las columnas de la rejilla y los checks son variables lógicas locales. Existen algunos checks para la marcación y desmarcación por grupos pero es poco relevante... 

El formulario recibe o devuelve las variables que comienzan por HIDE. El resto de variables son locales al mismo (la mayor parte son lógicas para los checks).

En el proceso On Init (Pre) del Formulario se da valor a las variables lógicas a partir de los valores de visibilidad actual recibidos en la variable HIDE_A_VAR. De esta forma, en el formulario se muestran con el check marcado las columnas visibles y con el check desmarcado las que el usuario no tiene a la vista. 

El usuario realiza la selección y puede grabarla para futuras ejecuciones, Cancelarla o Aceptarla. Por brevedad no voy a describir la grabación de la selección, pero es sencillo: basta con grabar en una Tabla el trio de datos [ Usuario, Rejilla, Variables elegidas] y recuperarlos con una función en el On Show de la Rejilla.

 

Este sería el aspecto en ejecución del Formulario de Selección...

Si la selección es Aceptada, se ejecuta el manejador de evento "ACEPTAR" que a su vez lanza el manejador SET_VAR para que prepare la variable HIDE_A_VIS con las condiciones de visibilidad seleccionadas, cerrando el formulario a continuación.

El manejador de la rejilla que había llamado al Formulario de selección recoge el valor de esa variable (rejillas a mostrar) y con sus valores (posicionales) define los datos de la matriz de Columnas a Ocultar. Después se asignan las Columnas siempre Visibles/Ocultas y se refresca la rejilla, cerrando el círculo lógico.

 

A continuación se muestra un fragmento del manejador [HIDE_SEL_COLS] de la rejilla que antes se había mostrado completo. Atiéndase a la forma en que se recibe y trata la variable HIDE_A-VIS que contiene las Columnas Seleccionadas (el código de las Columnas Siempre Ocultas/Visibles puede obviarse)

Espero que sea de utilidad...

Se agradecerá cualquier sugerencia que simplifique o mejore esta técnica...

bottom of page