viernes, 15 de febrero de 2013

Lista y filtro, todo en el mismo panel

En nuestras aplicaciones generalmente si tenemos un listado de datos, vamos a necesitar filtrar los mismos de alguna manera. A su vez, al desarrollar aplicaciones para Smart Devices con GeneXus, se nos presenta la duda de como implementar un panel (Panel for Smart Devices, Work With for Smart Devices) que contenga una grilla con datos y un filtro sobre los mismos, todo en la misma pantalla!

Ya habiamos visto anteriormente una solución de este tipo, veamos ahora paso a paso como implementar un ejemplo bien simple:

1. Creamos dos transacciones Paises y Clientes, y les aplicamos el pattern Work With for Smart Devices


2. El valor del filtro lo vamos a tener que manejar a través de la Web Session. Para eso creamos dos procedimientos, uno que guarda el valor en la Web Session y otro que la obtiene.


3. Siguiendo, creamos un Data Selector que va a ser usado para filtrar la grilla de datos utilizando el procedimiento que obtiene el valor desde la Web Session.


 4. Ahora si, creamos un Panel for Smart Devices, ponemos una grilla de ClienteId, ClienteNombre, PaisNombre filtrada con el Data Selector creado en el paso anterior



5. Agregamos una variable basada en PaisId, y para hacer más "lindo" el ejemplo, lo definimos como Dynamic Combo


6. Al lado de la variable &PaisId agregamos un Action para efectuar el filtro, poniendo el valor de &PaisId en la sesión y ejecutando un refresh


7. Finalmente, y muy importante, debemos configurar en el Panel for Smart Devices la propiedad Enable Data Caching con el valor False. Esto es necesario para que los datos se actualicen luego de aplicar el filtro debido a la implementación de caching de las aplicaciones GeneXus y a que estamos utilizando la Web Session para almacenar el valor del filtro.



Con esto ya tenemos funcionando la grilla y el filtro, todo en la misma pantalla.





Se puede ejecutar el ejemplo utilizando el KBN desde la siguiente dirección o descargar un xpz con el ejemplo aqui. (Nota: El ejemplo está hecho utilizando GeneXus X Evolution 2 Upgrade #2)


3 comentarios:

  1. Con PXTools hemos logrado automatizar este comportamiento. Simplemente se declaran los filtros igual que en Web y el resto lo hace PXTools.

    ResponderEliminar
  2. Necesito ayuda con algo asi, que tengo en mi app movil.
    Saludos

    ResponderEliminar
  3. no se ven las imagenes de las pantallas, ya se borraron?

    ResponderEliminar