CheckBox en la barra de titulos de un grid #Genexus

12:19 a.m. absolute , barra , check , CheckBox , class , columnas , css , css3 , deseleccionar , desmarcar , Genexus , Grid , marcar , position 0 Comentarios

Algunas veces las cosas mas sencillas pueden llevarnos mucho tiempo resolverlas, y terminamos realizando algo mas complejo de lo necesario.

En esta ocasión les mostrare como agregar un CheckBox en los títulos de la columna para seleccionar/desseleccionar todos los checkbox del grid de Genexus.

Para realizar esto solo necesitaremos seguir los siguientes pasos:

1. Creamos nuestro WebPanel:

2. Agregamos una tabla (No responsiva – la verde):

3. En la tabla agregamos el CheckBox que vamos a utilizar para seleccionar todo, y en la segunda columna agregamos nuestro grid.

4. Crearemos en el tema la clase SeleccionarTodoCelda.

5. En las propiedades de la clase que acabamos de crear, establecemos las siguientes propiedades.

• Left: 20px
• Position: absolute

6. Una vez creada y guardada nuestra clase, volvemos a nuestro WebPanel y seleccionamos el CheckBox que utilizaremos para seleccionar todo, y en sus propiedades, establecemos en la propiedad “Cell Class” la clase que acabamos de crear:

7. En los eventos, definiremos el evento .isValid para nuestro checkBox, en el cual recorremos todas las lineas del grid y seleccionaremos/deseleccionaremos todos los checkBox del grid.

Y obtendremos el resultado deseado, de una manera muy sencilla solo utilizando una clase para la celda con posicionamiento absoluto.

Espero que les sea de ayuda y lo compartan.