Capacidades de edición de la Grilla de Vaadin

Mon, 11 May 2020 14:37:51 +0000

En esta oportunidad, me gustaría hablar un poco sobre algo que creo que es una de las funcionalidades más poderosas del componente “Vaadin Grid”: la función de edición. La vista predeterminada del componente es una vista de solo lectura, de los datos de la tabla cargados en este componente. Pero si habilitamos el editor, podremos modificar visualmente las celdas de la grilla y cambiar los datos que ésta mantiene en la memoria del servidor. Analicemos algunas dificultades en el uso esta función y cómo superarlas.

Edición en línea

Si observamos la aplicación demo de ejemplo, veremos que el Editor es como un pequeño formulario que se abre cada vez que hacemos doble clic en una fila. Diferente al comportamiento previo del componente, en las versiones anteriores de Vaadin (Table). Con Table, cuando hacemos doble clic, la fila completa cambia a modo lectura/escritura, sin convertir la fila en un “mini-formulario” como ahora lo hace Grid. Por supuesto, este comportamiento es configurable, puedes deshabilitarlo simplemente invocando a setBuffered(false).

A pesar de ser de alguna manera mucho más visual, este nuevo comportamiento podría no ser no deseado para aquellas aplicaciones empresariales que dependen más del teclado, y no tanto del mouse, para manejar la tabla o la grilla.

Pero si los usuarios desean este tipo de manejo de la grilla, entonces el complemento Grid Fast Navigation Addon es lo ideal. Éste utiliza Component Extension featurepara darle a la grilla una nueva apariencia, que hace que la edición sea mucho más fácil y la transforma, otorgándole una de edición sencilla al estilo de Excel.

Complemento Grid Fast Navigation en acción.

Componentes

Otra cosa que evitó que algunos desarrolladores dejaran de usar Table y comenzaran a usar Grid, fue que no se podía usar un componente estándar dentro de una celda de la grilla. Si se desea, por ejemplo, utilizar casillas de verificación dentro de una celda, se debe crear una clase especial, llamada “renderer”, que debe manejar el lado cliente y el lado del servidor de esa celda.

Afortunadamente, hay algunos complementos que pueden ayudarte con esa tarea. El que se destaca es Grid renderes collection (disponible para las versiones Vaadin 7 y 8). Esta colección proporciona muchos componentes que permiten manejar selecciones, casillas de verificación, imágenes, etc.

En la última versión de Vaadin, una de las características más interesantes es el nuevo Renderer, que da la capacidad de utilizar un componente Vaadin dentro de una celda de una grilla. Se puede ver una vista previa en la aplicación de ejemplo.

Sin embargo, si estás utilizando Vaadin 7, podrías usar una versión experimental de esta característica, instalando Component Renderer Addon.
¡Pruébalo!

Addon on Flowing Code

Capacidades de edición de la Grilla de Vaadin

Edición en línea

Componentes