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?
Ejercicios de clase. Clase 7: ejemplo de composite component que utiliza una interfaz como atributo.
 |
| Los campos País, Ciudad, Número y Código Postal forman parte de un único composite component que representa la dirección del usuario |
En este ejemplo, tenemos un composite componente, que mejora la estrategia de diseño con respecto a lo visto en el ejercicio anterior, debido a que utiliza un managed bean que separa claramente la funcionalidad correspondiente al composite componente (métodos que implementan la interfaz Locatable que utiliza el componente como atributo) del resto de objetos de la aplicación web (propiedades para dar soporte a los datos de nombre y apellidos que no forman parte del composite component). Además, obliga a que todos los campos estén cubiertos, mediante la validación correspondiente.
Ejercicios de clase. Clase 7: ejemplo de implementación de composite component con managed bean y AJAX
 |
| En el facelet se incluye, como ejemplo, tres veces el composite component con distintas parametrizaciones. |
Este composite component está formado por tres listas desplegables que representan, de izquierda a derecha: el día, el mes y el año. Se puede configurar para especificar la fecha inicial (por defecto, la actual), el año máximo (por defecto, el actual) y el año mínimo del rango (por defecto, el actual menos 100). Además tiene funcionalidad AJAX, para que al detectar el cambio de un mes o de un año varíe el número de días que despliega la primera lista. Debido a su mayor complejidad, se apoya en un managed bean para implementar toda su lógica.
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)
- El usuario genera un evento, por ejemplo, seleccionando un elemento de la lista de compañías. El resultado es una llamada JavaScript.
- 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.
- 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.
- El objeto que procesó la petición retorna un documento XML, conteniendo toda la información actualizada que necesita recibir el cliente.
- 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.
Ejercicios de clase. Clase 7: ejemplo conceptual de composite components
Descarga el ejemplo de este composite component consistente en un único outputText que resalta en amarillo el texto que se le añade a través de un parámetro "value", y añádele la siguiente funcionalidad:
a) Que el color de resaltado sea un nuevo parámetro del composite component no obligatorio, amarillo por defecto.
b) Que el botón para enviar el formulario entre a formar parte del componente, parametrizando la etiqueta con el texto "Enviar" por defecto y requiriéndolo siempre.
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. |
Suscribirse a:
Entradas (Atom)