Mostrando entradas con la etiqueta jsf. Mostrar todas las entradas
Mostrando entradas con la etiqueta jsf. Mostrar todas las entradas

miércoles, 12 de junio de 2013

Ejercicios de clase. Clase 11: ejemplo de CDI, qualifiers e interceptor binding.

Saludo formal empleando inyección de dependencias

Saludo informal empleando un qualifier

 

Crea una aplicación web JSF que disponga de un sencillo formulario con un cuadro de texto (inputText) donde el usuario pueda escribir su nombre, un botón (commandButton) para enviar el formulario etiquetado como "Salúdame" y un cuadro de salida (outputText) para mostrar un saludo. Al pulsar el botón se invocará a un método de un bean que mostrará la salida en el outputText del formulario, consistente en un saludo al usuario de la forma ¡Hola, <nombreUsuario>! El bean tendrá dos propiedades: el nombre de usuario de tipo String y el saludo, que no será de tipo String, sino que pertenecerá a una clase Saludo con un método String getSaludo(String nombreUsuario) para obtener el String del saludo.

 

Descarga de la solución a los apartados 1 y 2 (proyecto NetBeans para GlassFish) 

Descarga de la solución a los apartados 3 y 4 (proyecto NetBeans para GlassFish)

 

  1.  Esta instancia de la clase Saludo ha de ser inyectada mediante CDI en el bean.
    Tanto el bean como la clase Saludo están anotadas con @Named. Por otra parte, la declaración de la referencia a la instancia de la clase Saludo es anotada con @Inject

  2. Crea un clase derivada de Saludo, SaludoInformal, que sobreescriba el método getSaludo() cambiando el saludo que devuelve por ¡Ey, <nombreUsuario>! Crea un qualifier @Informal para que pueda ser injectada la clase derivada en lugar de la clase base en el campo del bean.
    Creando un qualifier "Informal" asociado a la clase derivada de Saludo, SaludoInformal, podemos anotar la referencia original con @Informal para indicar que se quiere inyectar una instancia de la clase derivada (SaludoInformal) a pesar de tratarse de una declaración de atributo del tipo Saludo (la clase base)

  3. Crea un Interceptor Binding que cada vez que se llame a getSaludo() escriba a la entrada al método "Llamando a <método> con argumento <nombreUsuario>" y que escriba a la salida "Saliendo de <método> con valor de retorno <saludo>"

  4. Crea un estereotipo que permita sustituir el uso de las anotaciones @Named y
    @RequestScoped por una única anotación. Aplica el estereotipo a las clases Saludo y SaludoInformal. 

     

jueves, 6 de junio de 2013

Ejercicios de clase. Clase 7: utilizar componentes de la biblioteca PrimeFaces

 

Accede a la página de primeFaces, descarga la última versión de la librería (3.5), e intenta incluir en un proyecto web los componentes NotificationBar y Pie. Después, descárgate la documentación oficial, investiga sobre los atributos de los componentes y realiza los siguientes cambios:

  • Cambia el texto de la barra de notificación

  • Cambia la posición de la barra de notificación

  • Cambia la forma de desplegarse de la barra de notificación

  • Cambia los títulos y los nombres de las series de los gráficos

  • Cambia los colores de los sectores de uno de los gráficos.

  • ¿Qué atributos hacen que, a diferencia del primero, el segundo gráfico no tenga relleno y muestre los porcentajes?

     



miércoles, 5 de junio de 2013

Ejercicios de clase. Clase 7: AJAX en JSF

Crea un facelet con dos listas desplegables que representen marcas de fabricantes de teléfonos y algunos de sus respectivos modelos. Cuando el usuario cambie la selección del fabricante debe cambiar automáticamente la lista de modelos, sin necesidad de enviar (hacer submit()) sobre el formulario que las contenga, empleando la tecnología AJAX (Asynchronous JavaScript And XML)



  1. El usuario genera un evento, por ejemplo, seleccionando un elemento de la lista de compañías. El resultado es una llamada JavaScript.
  2. Se crea un objeto XMLHttpRequest, configurado con un parámetro de petición que incluye el identificador del componente que genera el evento y cualquier valor que el usuario pueda haber introducido.
  3. El objeto XMLHttpRequest hace una petición asíncrona al servidor Web. Un objeto (concretamente un método listener o escuchador en un JavaBean, en este caso) recibe la petición y la procesa en segundo plano.
  4. El objeto que procesó la petición retorna un documento XML, conteniendo toda la información actualizada que necesita recibir el cliente.
  5. El objeto XMLHttpRequest recibe los datos XML, los procesa ejecutando automáticamente el método que recibe el resultado (callback) y actualiza el modelo de objetos del documento (DOM) del facelet con los nuevos datos, es decir, con la lista de modelos para la nueva compañía seleccionada.



martes, 4 de junio de 2013

Ejercicios de clase. Clase 6: "converters" y "validators" personalizados.

El facelet inicial nos solicita una URL

El facelet de confirmación añade el prefijo del protocolo http:// si el marcador no lo tenía inicialmente


Descargar ejemplo convertidor marcador URL (proyecto Netbeans para GlassFish)


El facelet de inicio comprueba si el e-mail del formulario está bien formado

El facelet de confirmación valida el e-mail de entrada si es correcto.


Descargar ejemplo validador campo e-mail (proyecto NetBeans para GlassFish)


EJERCICIO PROPUESTO:

 

a) Crea un convertidor que tome un número de D.N.I y, si no tiene letra, le añada la letra correspondiente. 

 

b) Crea un validador que tome un número de D.N.I y compruebe si tiene letra al final. En caso de tenerla, se asegurará de que ésta sea la correcta. 

 

NOTA: toma como referencia el ejemplo de código java de la wikipedia para el algoritmo del cálculo de la letra del D.N.I.

  public static final String NIF_STRING_ASOCIATION = "TRWAGMYFPDXBNJZSQVHLCKE";
 
  /**
   * Devuelve un NIF completo a partir de un DNI. Es decir, añade la letra del NIF
   * @param dni dni al que se quiere añadir la letra del NIF
   * @return NIF completo.
   */
  public static String letraDNI(int dni) {
    return String.valueOf(dni) + NIF_STRING_ASOCIATION.charAt(dni % 23);
  }



El validador se asegura de que se trata de 8 dígitos numéricos seguidos de una letra mayúscula o minúscula

El validador se asegura de que, en caso de añadir la letra, ésta es la correspondiente a ese número de D.N.I.

Si la letra no es introducida, el convertidor la añade automáticamente.
Si la última letra es introducida, ya sea en mayúscula o minúscula, el convertidor lo detecta y no hace ninguna transformación mientras que el validador verifica si se trata de la letra correcta.








Ejercicios de clase. Clase 6: uso de los "converters" de las bibliotecas JSF

 

Crea un formulario JSF que solicite el nombre, la edad, la fecha de nacimiento y el sueldo. Empleando los "converters" proporcionados por las bibliotecas de JSF convierte la fecha a tipo Date con el formato dd/MM/yyyy. Por otra parte, el sueldo será almacenado en un bean como BigDecimal y la edad como Integer.


Ejercicios de clase. Clase 6: ejemplo de aplicación JSF

Aspecto del facelet index. Se solicitan los datos básicos del cliente y dos colores para determinar el aspecto que tendrá el curriculum del usuario

Activando/Desactivando la casilla de verificación se pueden mostrar los colores con nombes o con código hexadecimal.

El formulario valida los datos de entrada de manera que todos los campos son obligatorios y la edad debe estar entre 16 y 64

El currículum se muestra con los datos recogidos en el formulario de entrada y los colores seleccionados.

Si el color frontal y de fondo seleccionados son el mismo, se nos redirige a una página de error.



Aspectos a destacar:

  • El manejo de eventos (véase cómo se maneja el evento de cambio de estado de la casilla de verificación)

  • Los mecanismos de validación

  • Uso de los archivos de propiedades para el cambio inmediato de idioma (internacionalización)

  • Carga de archivos de propiedades usando anotaciones en vez de etiquetas en faces-config.xml

  • Uso de parámetros en el formateo de mensajes ({0},{1},... en los valores de los archivos de propiedades)

  • Reglas de navegación (tanto en faces-config.xml como en el asistente gráfico -pestaña PageFlow del archivo de configuración-)  

  • Declaración de un Managed Bean en el archivo faces-config.xml como alternativa tradicional a las nuevas anotaciones.


Diapositivas. Clase 6: validaciones y conversiones en JSF

lunes, 3 de junio de 2013

Ejercicios de clase. Clase 5: aplicación JSF básica.

Crea una aplicación JSF que disponga de dos facelets: uno que permita introducir un nombre en un formulario y otro que al recibir el formulario, visualice un saludo personalizado empleando el nombre introducido en el cuadro de texto, tal y como se muestra en las figuras:


El facelet index.xhtml visualiza un sencillo formulario para escribir un nombre

El facelet confirmacion.xhtml visualiza un saludo empleando el nombre escrito en el formulario.

 

Ten en cuenta los siguiente aspectos adicionales:

  1. Utiliza una etiqueta <h:panelGrid> para que se organicen los elementos index.xhtml de manera que junto al cuadro de texto del nombre aparezcan los mensajes de error de las validaciones.

  2. Los errores de validación deben mostrarse de color violeta.

  3. El envío de datos de un facelet al otro debe hacerse mediante un Managed JavaBean con una propiedad "nombre" de tipo cadena.

  4. Rellenar el campo nombre será obligatorio. En caso de dejarse vacío deberá aparecer el mensaje: "Debe completar el campo de nombre".

     

  5. Comprueba que el texto introducido tiene una longitud de entre 5 y 15 caracteres. En caso de que no sea así, debe visualizarse el mensaje de validación por defecto precedido de "Campo nombre".

     



  6. Haz que la etiqueta del campo de texto y los mensajes de los apartados d) y e) sean referenciados desde un archivo de propiedades "cadenas.properties" incluido en un paquete llamado "recursos" (para que funcione debes crear un archivo de configuración faces-config.xml y declarar recursos.cadenas y una variable para referenciarlo desde los facelets)

     




Diapositivas. Clase 5. Java Server Faces