lunes, 15 de agosto de 2011

Llenar un combo o g:select utilizando un Enum (Groovy - Grails)

En la mayoría de lenguajes de programación existe un tipo de datos llamado enumerado (Enumerated) o como suelen conocerse  Enum type, estos son fantásticos para una pequeña lista de datos que puedes utilizar en distintos puntos de tu aplicacion y cuyo contenido no van a cambiar en el futuro, y por tanto no amerita crear una tabla en nuestra base de datos. Ejemplo: los meses del año o días de la semana.

Particularmente esta entrada es sobre de uso de los Enum en Groovy en aplicaciones desarrolladas con Grails.


Paso 1 : Crear el enum
Podemos utilizar la versión simple
package org.blog.ejemplos

enum Dias {
    LUNES, MARTES, MIERCOLES, JUEVES, VIERNES, SABADO, DOMINGO
}

o una versión más avanzada que nos permita añadir más funcionalidad

package org.blog.ejemplos

enum Dias {
      
       // Datos del enum
       LUNES(1, "Lunes","LUN"),
       MARTES(2,"Martes","MAR"),
       MIERCOLES(3,"Miércoles","MIE"),
       JUEVES(4,"Jueves","JUE"),
       VIERNES(5,"Viernes","VIE"),
       SABADO(7,"Sábado","SAB"),
       DOMINGO(8,"Domingo","DOM");

       private final int numero
       private final String nombre
       private final String abreviatura

       Dias(int numero,String nombre,String abreviatura){
             this.numero = numero
             this.nombre = nombre
             this.abreviatura = abreviatura
       }
            
       // Metodos Getters para acceder a las propiedades del enum
       private int numero() { return numero }
       private String nombre() { return nombre }
       private String abreviatura() { return abreviatura }

}
  
Paso 2 : Importar enum
Al inicio de nuestra página .gsp agregamos el tag necesario para importar nuestro enum

<%! import org.blog.ejemplos.Dias %>

<html>
    <head> … </head>
    <body> … </body>
</html>


Paso 3 : Obtener datos del enum

Creamos el g:select, en la propiedad optionKey escribrimos el valor que deseamos recuperar y en optionValue lo que queremos mostrar.
 
   <div class="dialog">
      <h2>Escoge tu d&iacute;a favorito:</h2> 
      <g:select id="dias" name="dias"
                noSelection="['': '']"
                from="${Dias.values()}"
                optionKey="abreviatura"
                optionValue="nombre"
                onchange="escribirDia(this)"/>
  </div>

 Adicionalmente y según sea nuestra necesidad, podemos definir una función javascript para recuperar el valor seleccionado.

<script type="text/javascript">
   function escribirDia(itemSeleccionado){

         // Devuelve el index de la opcion seleccionada, ej: 0,1,2... 
         var index = itemSeleccionado.selectedIndex        

         // Devuelve el valor de la opcion seleccionada
         var abreviatura = itemSeleccionado.value        

         // Devuelve el texto una opcion, segun el index dado         
         var nombre = itemSeleccionado.options[index].text 
        
      document.getElementById("tuDia").innerHTML = abreviatura  + " - " + nombre;
   }
 </script>
  

Resultado