Como crear un campo editable con un custom suggest en #Genexus

5:00 p.m. , , , 0 Comentarios

 Todos conocemos que en genexus existe la propiedad Suggest para los campos edit, el cual permite que cuando se ingrese información en el campo te muestra sugerencias que carga desde un catálogo para que puedas seleccionar, pero que pasa si lo que quieres es tener un campo en el que puedas escribir, te muestre sugerencias y en caso de que lo que ingresaste no exista en el catálogo, lo puedas agregar, esto no lo permite el campo con propiedad suggest.

Justamente eso es lo que me sucedió cuando en una sección donde tenía que agregar Habilidades, quería mostrar un campo en el que se escribiera la habilidad y en caso de que ya existiera te mostrará sugerencias del catálogo, pero si no existía te permitiera agregarla como nueva, pero me lleve la sorpresa de que el suggest no permite que obtengas el valor escrito si no existe en una tabla, asi que cree mi propio suggest, que es lo que a continuación les mostraré.


Custom suggest en #Genexus

    1. Creamos una transacción de ejemplo que usaremos como catálogo que alimentará nuestro suggest custom:


    2. Creamos un nuevo webpanel :



    2. En el web form vamos a agregar una tabla con una variable (&editHabilidadNombre Varchar 200) y una imagen que sera el botón para agregar:


    3. Agregamos otra tabla que llamaremos TblGridHabilidadSuggest y dentro agregamos un grid que llamaremos GridHabilidadSuggest que tendra las variables &gHabilidadNombre y &gHabilidadId


    4. En las propiedades del grid, vamos a activar la propiedad Allow Selection:

    

    5. En el theme creamos una nueva clase table a la cual llamaremos TableGridSuggest y se la asignaremos a la tabla que contiene al grid, la cual debe tener las siguientes propiedades:

    

    

    6. En el Theme creamos una nueva clase del tipo GridRow a la cual llamaremos GridRowNoHeader y le pondremos la siguiente propiedad:


    7. En el Theme creamos una nueva clase del tipo Grid que llamaremos GridSinHeader y se la asignaremos al grid que creamos, tendra las siguiente propiedades :


    8. En la sección de eventos, en el start vamos a ocultar la tabla que contiene el grid:


    9. Agregamos otro evento que va a controlar cuando se este escribiendo sobre el campo y realizara un refresh sobre el grid:


    10. Creamos el evento load del grid, en el cual validamos si el campo no esta vacio, en ese caso recorremos con un for each el catalogo de habilidad y filtramos por las habilidades que inicien con lo que esta escrito en el campo hasta el momento, y volverá visible la tabla que contiene el grid:


    11. Creamos el evento OnLineActivate del grid, en el que vamos a llamar un procedimiento que nos guardara la habilidad seleccionada en el suggest, después vamos a limpiar el campo con setEmpty() y ocultamos la tabla que contiene al grid:



De esta forma tendremos un grid que funciona como un suggest y si lo que se ingreso en el campo no existe en nuestro catalogo tenemos la posibilidad de agregar directamente usando lo que se ingreso en el campo.


He omitido varias partes como el evento del boton para agregar, ya que este funciona como cualquier otro y no es importante para lo que se quiere mostrar. También omití que hay otro grid debajo en el cual se van mostrando las habilidades que ya estan agregadas y que se van agregando, pero no es necesario para realizar el custom suggest.


Seguramente habrá mejores formas para resolver esta necesidad o tengan otras ideas para mejorarlo y me encantará leerlos, así que si gustan pueden comentar aquí cualquier idea o duda que tengan.





Jesús Rodríguez

Consultor Genexus Senior - Scrum Master, Emprendedor, siguiendo mis sueños.

0 comentarios: