Programando el Evento Start, Click o De usuario en un Web Panel

Transcripción

1 Programando el Evento Start, Click o De usuario en un Web Panel Teníamos un web panel que desplegaba información de los clientes y permitía filtrar la información desplegada por nombre completo del cliente. Ahora supongamos que queremos poder trabajar con un cliente, agregando una acción que se active al cliquear sobre una imagen del grid (la de un avión por ejemplo), y que muestre los datos de los vuelos en los que el cliente está registrado En este caso el cliente 1 está en el vuelo 1, con asiento 1 C En el vuelo 5 con asiento 2 B Y en el vuelo 6 con asiento 2 D. Donde la suma de los precios de los vuelos es 6400 Este será un web panel, diseñado análogamente Con un grid cuyos atributos son FlightId FlightArrivalCountryName, subtipo, inferido a través de FlightArrivalCountryId de CountryName FlightFinalPrice FlightSeatId Y FlighSeatChar Por lo tanto, su tabla base será FlightSeat. Pero, dónde le estamos indicando que cargue sólo los datos de los vuelos del cliente seleccionado? Tendremos que recibir el identificador de cliente en la regla parm por ejemplo en una variable Y luego especificar como condición del grid que el atributo CustomerId asuma el valor recibido por parámetro Con eso, lo único que nos estará faltando será pasarle el cliente seleccionado al web panel cuando lo invoquemos desde la acción Aquí tenemos el web panel que invocaremos, ya creado. Page1

2 Ahora vayamos a agregar la acción a nuestro web panel En las columnas del grid, agregamos una nueva, que es donde vamos a cargar la imagen de avión como en un grid estándar las columnas sólo pueden ser atributos o variables, insertemos entonces una nueva variable, en la que cargaremos luego la imagen La llamaremos flightimage de tipo de datos Image. La movemos, para que quede al final y le quitamos el título a la columna. Tenemos que cargarla con la imagen adecuada. Para eso, debemos insertar esa imagen en la KB, para poder utilizarla luego donde necesitemos. Page2

3 Una forma de hacerlo es ir a Customization y eligiendo Images, donde se listan todas las imágenes actualmente almacenadas en la KB, insertar una nueva La queremos cargar desde un archivo La elegimos Le dejamos como nombre flight Y grabamos Y ahora tenemos que asignárela a la variable Cómo? El lugar más apropiado sería el evento Start, que es lo primero que se ejecuta donde a la variable &flightimage le aplico el método Page3

4 FromImage que tiene como parámetro el nombre de la imagen de la KB, que en nuestro caso habíamos llamado flight. Hagamos F5 Page4

5 Vemos cómo sale cargada la imagen. Nos está faltando únicamente asociarle la acción. Como queremos que al hacer clic sobre la imagen se invoque al web panel Podemos programar el evento click, asociado al control de nombre flightimage, el nombre de la variable. Y allí invocar al web panel Pasándole como parámetro el atributo CustomerId que no está en el grid Event &flightimage.click CustomerFlights( CustomerId ) Endevent Hagamos F5. Page5

6 Dos observaciones: la variable de los precios, pasó a ser de entrada, es decir, podemos cambiarle el valor. Esto fue consecuencia de haber asociado un evento a las líneas. Tendremos que ponerla explícitamente en ReadOnly, dado que no deseamos este comportamiento. Por otro lado, los datos de los vuelos del cliente están saliendo vacíos. Por qué? Porque estamos enviando por parámetro CustomerId, pero si vamos al grid, este atributo no se encuentra presente ni visible, ni invisible. Si tenemos presente que luego de cargado el grid sólo tenemos disponibles los atributos y variables definidos como columnas, entonces la invocación pasará como parámetro un valor vacío, ya que no tenemos una columna para CustomerId. Por lo tanto, necesitamos agregarla al grid, dejando al atributo CustomerId oculto, ya que no nos interesa mostrarlo. Vemos que lo indica: Aprovechamos y ponemos &flighprices como ReadOnly. Y damos nuevamente F5 Ahora sí, está funcionando como esperábamos. Observemos que en lugar de haber programado el evento click sobre la imagen de avión, podríamos haberle asignado al control el evento Enter, que en este caso no es el más adecuado, dado que no tendría sentido presionar la tecla enter para ejecutarlo porque, a qué cliente correspondería? En su lugar podríamos haberle asignado un evento de usuario Page6

7 Al que le damos un nombre Y vamos a programarlo Colocándole el código que habíamos especificado en el evento click. Page7

8 Elegir asociarle un evento de usuario a la variable en lugar de programar el click, tiene como ventaja poder asociar el mismo evento a varios controles a la vez. En este caso, no lo necesitamos. Page8