JSF
JavaServer Faces
- Un conjunto de APIs para representar componentes de una interfaz de usuario y administrar su estado, manejar eventos, validar entrada, definir un esquema de navegación de las páginas y dar soporte para internacionalización y accesibilidad.
- Un conjunto por defecto de componentes para la interfaz de usuario.
- Dos bibliotecas de etiquetas personalizadas para JavaServer Pages que permiten expresar una interfaz JavaServer Faces dentro de una página JSP.
- Un modelo de eventos en el lado del servidor.
- Administración de estados.
- Beans administrados.
Porqué utilizar JSF en nuestros proyectos
nos permite desarrollar rápidamente aplicaciones de negocio dinámicas en las que toda la lógica de negocio se implementa en java, o es llamada desde java, creando páginas para las vistas muy sencillas (salvo que introduzcamos mucha maquetación HTML o Javascript)
JSF
nos ofrece una serie de ventajas:
- El código JSF con el que creamos
las vistas (etiquetas jsp) es muy parecido al HTML estándar.
Lo pueden utilizar fácilmente desarrolladores y
diseñadores web.
- JSF se integra dentro de la página
JSP y se encarga de la recogida y generación de los valores
de los elementos de la página
- JSF resuelve validaciones, conversiones,
mensajes de error e internacionalización.
- JSF permite introducir javascript en la
página, para acelerar la respuesta de la interfaz en el
cliente
- JSF es extensible, por lo que se pueden
desarrollar nuevos componentes a medida, También se puede
modificar el comportamiento del framework mediante APIs que
controlan su funcionamiento.
Desde
el punto de vista técnico podemos destacar los siguientes:
- JSF forma parte del estándar J2EE,
mientras que otras tecnologías para creación de vistas
de las aplicaciones no lo forman, como por ejemplo Struts.
- JSF dispone de varias implementaciones
diferentes, incluyendo un conjunto de etiquetas y APIs estándar
que forman el núcleo del framework.
- El desarrollo de JSF está realmente
empezando. Las nuevas versiones del framework recogen la
funcionalidad de versiones anteriores siendo su compatibilidad muy
alta, de manera que el mantenimiento de aplicaciones no se ve
penalizado por el cambio de versiones.
Ejemplo Primer Programa JSF
Figura 1: Creando un proyecto
Figura 2: Creando un proyecto
Figura 3: elijiendo un framework
Ciclo de vida
Cuando se carga la aplicación web en el servidor se inicializa el framework JSF. Se lee el fichero de configuración faces-config.xml y se crean los beans gestionados definidos con el ámbito application , realizando las sentencias de incialización necesarias. Después el motor de JSF está listo para recibir peticiones y para lanzar el ciclo de vida de JSF con cada una.Lo que en JSF se denomina ciclo de vida no es más que una secuencia de fases por las que pasa una petición JSF desde que se recibe en el servidor hasta que se genera la página HTML resultante. El servlet que implementa el framework ( javax.faces.webapp.FacesServlet ) recibe la petición y realiza todo el ciclo, creando y utilizando los objetos Java que representan los componentes JSF y los beans gestionados. La relación entre estos objetos y la generación de código HTML a partir del árbol de componentes constituyen la base del funcionamiento del framework.
Las fases del ciclo de vida son las siguientes:
- Restaurar la vista ( restore view ). En este paso se obtiene el árbol de componentes correspondiente a la vista JSF de la petición. Si se ha generado antes se recupera, y si es la primera vez que el usuario visita la página, se genera a partir de la descripción JSF.
- Aplicar los valores de la petición ( apply request values ). Una vez obtenido el árbol de componentes, se procesan todos los valores asociados a los mismos. Se convierten todos los datos de la petición a tipos de datos Java y, para aquellos que tienen la propiedad inmediate a cierta, se validan, adelantándose a la siguiente fase.
- Procesar las validaciones ( process validations ). Se validan todos los datos. Si existe algún error, se encola un mensaje de error y se termina el ciclo de vida, saltando al último paso (renderizar respuesta).
- Actualizar los valores del modelo ( update model values ). Cuando se llega a esta fase, todos los valores se han procesado y se han validado. Se actualizan entonces las propiedades de los beans gestionados asociados a los componentes.
- Invocar a la aplicación ( invoke application) . Cuando se llega a esta fase, todas las propiedades de los beans asociados a componentes de entrada ( input ) se han actualizado. Se llama en este momento a la acción seleccionada por el usuario.
- Renderizar la respuesta ( render response ).
Patón MVC
Modelo–vista–controlador (MVC) es un patrón de arquitectura de software, que separa los datos y la lógica de negocio de una aplicación de la interfaz de usuario y el módulo encargado de gestionar los eventos y las comunicaciones. Para ello MVC propone la construcción de tres componentes distintos que son el modelo, la vista y el controlador, es decir, por un lado define componentes para la representación de la información, y por otro lado para la interacción del usuario.1 2 Este patrón de arquitectura de software se basa en las ideas de reutilización de código y la separación de conceptos, características que buscan facilitar la tarea de desarrollo de aplicaciones y su posterior mantenimiento
Descripción del Patrón:
- El Modelo: Es la representación de la información con la cual el sistema opera, por lo tanto gestiona todos los accesos a dicha información, tanto consultas como actualizaciones, implementando también los privilegios de acceso que se hayan descrito en las especificaciones de la aplicación. Envía a la 'vista' aquella parte de la información que en cada momento se le solicita para que sea mostrada.
- El Controlador: Responde a eventos (usualmente acciones del usuario) e invoca peticiones al 'modelo' cuando se hace alguna solicitud sobre la información (por ejemplo, editar un documento o un registro en una base de datos). También puede enviar comandos a su 'vista' asociada si se solicita un cambio en la forma en que se presenta el 'modelo', por tanto se podría decir que el 'controlador' hace de intermediario entre la 'vista' y el 'modelo'.
- La Vista: Presenta el 'modelo' (información y lógica de negocio) en un formato adecuado para interactuar por tanto requiere de dicho 'modelo' la información que debe representar como salida.
¿Qué es un facelets?
Facelets es un sistema de código abierto de plantillas web bajo la Licencia Apache y la tecnología de controlador de JavaServer Faces (JSF). El lenguaje requiere documentos XML de entrada válidos para trabajar. Facelets es compatible con todos los componentes de la interfaz de usuario de JSF y se centra por completo en la construcción del árbol de componentes, lo que refleja el punto de vista de una aplicación JSF.Aunque ambas tecnologías JSF y JSP han mejorado para trabajar mejor juntas, Facelets elimina los problemas señalados en el artículo de Hans Bergsten "Improving JSF by Dumping JSP".1
Facelets se basa en algunas de las ideas de Apache Tapestry, y es lo suficientemente similar para hacer una comparación.
Uso de las siguientes etiquetas de facelets:
<c:forEach>
Nos permite hacer ciclos en una jsp.Crea la clase Lista en el paquete beans.
En la etiqueta
<c:forEach> el parámetro var=”nombreActual” es simplemente un apuntador hacia el objeto actual de la iteración.
</c:forEach>
<h:selectOneMenu>
hace que un elemento de entrada HTML del tipo "seleccionar" con tamaño no especificado.
</h:selectOneMenu>
Validación en JSF
Validators por defecto
JSF viene con algunos validadores habituales de campos. Por ejemplo, si queremos que un número esté dentro de un rango, podemos poner el siguiente código html en nuestro formularioEjemplo:
<h:form>
<h:inputText id="idNumero2" required="true">
<f:validateLongRange minimum="-10" maximum="10"></f:validateLongRange>
</h:inputText>
<h:commandButton action="bien.xhtml" value="Enviar">
</h:commandButton>
<h:message for="idNumero2"></h:message>
</h:form>
Es un formulario. Dentro de él hay un inputText y dentro del
inputText un <f:validateLongRange> con un minimum y un maximum. El
inputText además tiene required="true", por lo que no se podrá dejar en
blanco.
Cuando pulsemos el botón de "Enviar" que hay justo debajo, se validará automáticamente el contenido del campo de texto, tanto que se ha rellenado como que lo introducido es un número entre -10 y 10 (ambos incluives) dando un error en caso contrario.
Si hay error, no se enviaré el formulario y se volverá a mostrar la misma página que lo contiene. El error aparecerá en la etiqueta <h:message>, en la que hemos puesto el atributo for="idNumero2", correpondiente al campo de texto. Cuando se muestre el formulario por primera vez,
Tenemos varios validators disponibles :
- f:validateBean
- f:validateDoubleRange
- f:validateLength
- f:validateLongRange
- f:validateRegex
- f:validateRequired
Registrar un validador:
Podemos hacer una clase de validación y registrarla, de forma que luego la podamos usar cómodamente donde queramos. En primer lugar, creamos la clase que implemente Validator, definiendo el único método que tiene, igual que el que hemos hecho en el apartado anterior. En el siguiente ejemplo comprobamos que el campo es un número entero entre -10 y 10. Si lo es no hay que hacer nada, si no lo es, debemos lanzar una ValidatorExceptionpackage com.chuidiang.ejemplos.jsf;
import javax.faces.application.FacesMessage;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.validator.Validator;
import javax.faces.validator.ValidatorException;
public class MiValidador implements Validator {
@Override
public void validate(FacesContext arg0, UIComponent arg1, Object arg2)
throws ValidatorException {
if (!(arg2 instanceof Integer)) {
throw new ValidatorException(new FacesMessage("Debe ser un entero"));
}
int valor = (Integer) arg2;
if ((valor < -10) || (valor > 10)) {
throw new ValidatorException(new FacesMessage(
"Debe estar entre -10 y 10"));
}
}
}
Para registrarla, debemos poner esta clase en el fichero WEB-INF/faces-config.xml. En este fichero sólo debemos dar un identificador al validator y decir a qué clase corresponde, que es la que acabamos de hacer. El fichero puede quedar así:
<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
version="2.0">
<validator>
<validator-id>MasMenos10</validator-id>
<validator-class>com.chuidiang.ejemplos.jsf.MiValidador</validator-class>
</validator>
</faces-config>
Y ahora, en la página html, sólo tenemos que poner un tag <f:validator validatorId="MasMenos10"></f:validator>, tal que así:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title>Hola mundo</title>
</h:head>
<h:body>
<h:form>
<h:inputText id="unNumero" required="true" value="#{holaMundo.valor}">
<f:validator validatorId="MasMenos10"></f:validator>
</h:inputText>
<h:commandButton value="Enviar" action="hola2.xhtml"></h:commandButton>
</h:form>
<h:message for="unNumero"></h:message>
</h:body>
</html>
donde al inputText le hemos puesto un value que hace referencia a un atributo entero (valor) de una clase (holaMundo), de forma que nuestro validador recibirá un entero en vez de un String, como se comentó en el apartado anterior.
Comentarios
Publicar un comentario