PDF de programación - Sesión 3: Ciclo de vida JSF. Conversores. Validadores. Eventos

Experto Universitario Java Enterprise

JavaServer Faces

•Sesión 3: Ciclo de vida JSF.
Conversores. Validadores.
Eventos.

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Índice
• El ciclo de vida de una petición
• Validaciones

• Custom validators
• JSR 303

• Conversiones

• Custom converters
• Gestión de eventos

• Validación mediante eventos
• Toma de decisiones

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

2

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

El ciclo de vida visto desde fuera

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

3

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

El ciclo de vida visto desde dentro

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

4

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Programa ejemplo: calculadora

Componentes que se
hacen visibles y se ocultan

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

5

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Código de la vista

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

6

<f:view> <h:form id="calcForm"> <h:panelGrid columns="3"> <h:outputLabel value="Primer número"/> <h:inputText id="firstNumber" ! value="#{calcBean.firstNumber}" ! required="true"/> <h:message for="firstNumber"/> ... <h:commandButton value="Calcular" action="#{calculatorController.doOperation}"/> <h:outputText value="Resultado: #{calculatorBB.result}"/><br/> <p></p> <h:commandLink rendered="#{calculatorController.newOperationCommandRendered}" action="#{calculatorController.doNewOperation}" value="Cambiar operación"/> ... </h:form> </f:view> Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Componentes (1)

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

7

<h:form id="calcForm"> <h:panelGrid columns="3"> <h:outputLabel value="Primer número"/> <h:inputText id="firstNumber" ! value="#{calcBean.firstNumber}" ! required="true"/> <h:message for="firstNumber"/> ... <h:commandButton value="Calcular" action="#{calculatorController.doOperation}"/> <h:outputText value="Resultado: #{calculatorBB.result}"/><br/> <p></p> <h:commandLink rendered="#{calculatorController.newOperationCommandRendered}" action="#{calculatorController.doNewOperation}" value="Cambiar operación"/> ...</h:form> Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Componentes (2)

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

8

<h:form rendered="#{calculatorController.selectOperationFormRendered}"> <h:selectOneListbox id="operation" required="true" !! value="#{calculatorBB.operation}"> <f:selectItem itemValue="+" itemLabel="suma"/> <f:selectItem itemValue="-" itemLabel="resta"/> <f:selectItem itemValue="*" itemLabel="multiplicación"/> <f:selectItem itemValue="/" itemLabel="división"/> </h:selectOneListbox><br/> <h:commandButton action="#{calculatorController.doSelectOperation}" value="Selecciona operación"/></h:form> Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Renderizado de los componentes
• Se define con las propiedades booleanas newOperationRendered

y selectOperationFormRendered en el bean
calculatorController

• Las acciones modifican el valor booleano de esas propieades

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

9

<f:view> <h:form id="calcForm"> ... <h:commandLink rendered="#{calculatorController.newOperationCommandRendered}" action="#{calculatorController.doNewOperation}" value="Cambiar operación"/> ... </h:form> <h:form rendered="#{calculatorController.selectOperationFormRendered}"> <h:commandButton action="#{calculatorController.doSelectOperation}" value="Selecciona operación"/> </h:form> </f:view> Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

¿Cuándo se crea el árbol de componentes?

• En la primera petición (http://localhost:8080/calculator) se
crea el árbol de componentes a partir del fichero
calculator.xhtml
• El árbol de componentes (vista) se guarda en el
servidor.
• En la segunda petición (cuando el usuario pincha en
el enlace “calcular” y se envía el formulario al
servidor), JSF obtiene el árbol creado anteriormente,
lo guarda en la petición y le aplica el ciclo de vida a la
petición.

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

10

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise
Controlador (1)

Propiedades

Mostrando
y ocultando

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

11

public class CalculatorController { private CalculatorBB numbers; private CalculatorBO calculator = new CalculatorBO(); private boolean selectOperationFormRendered=false; private boolean newOperationCommandRendered=true; ... // getters y setters public String doNewOperation() { selectOperationFormRendered=true; newOperationCommandRendered=false; return null; } public String doSelectOperation() { selectOperationFormRendered=false; newOperationCommandRendered=true; doOperation(); return null; } ... Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise
Controlador (2)

Obtenemos
los valores
introducidos
por el usuario
leyéndolos del
backing bean,

llamamos
a la capa
de negocio

y ponemos
el resultado
en el backing
bean.

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

12

...public String doOperation() { String operation = numbers.getOperation(); int firstNumber = numbers.getFirstNumber(); int secondNumber = numbers.getSecondNumber(); int result = 0; String resultStr = "OK"; if (operation.equals("+")) result = calculator.add(firstNumber, secondNumber); else if (operation.equals("-")) result = calculator.substract(firstNumber, secondNumber); else if (operation.equals("*")) result = calculator.multiply(firstNumber, secondNumber); else if (operation.equals("/")) result = calculator.divide(firstNumber, secondNumber); else resultStr="not-OK"; numbers.setResult(result); return resultStr; } Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Conversión de datos
• En una aplicación web, todos los datos se introducen
como texto
• JSF convierte:

• los datos a tipos java en la fase Apply Request Values
• los tipos java a String en la fase Render Response

• JSF usa una serie de conversores por defecto para tipos
básicos, aunque podemos escogerlos.

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

13

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

específicos (DNI, Tarjetas de crédito, ...)

Custom converters
• En ocasiones podemos necesitar conversores más
• Para esos casos, podemos crearnos nuestros propios
• Deben implementar la interfaz javax.faces.convert.FacesConverter.
• Proporciona los métodos:

conversores.

• Object getAsObject(FacesContext context, UIComponent
component, String newValue):

String Objeto.
Si no puede convertir ConverterException

• String getAsString(FacesContext context, UIComponent
component, Object value):

Objeto String

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

14

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Custom converters
• Un conversor se define mediante la anotación
@FacesConverter(“ID_Conversor”)

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

15

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Custom converters
• Haremos uso de un custom converter mediante el tag
<f:converter>

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

16

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Custom converters
• Podemos obviar el uso del tag <f:converter> si
especificamos en la clase conversora que se aplique
siempre para un tipo de objeto.

• Así, será la implementación de JSF quien busque
conversores para este tipo de objeto.

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

17

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Custom converters
• Podemos pasar atributos a nuestro conversor
mediante el tag <f:attribute>

• El código en el conversor será

Componentes de presentación

© 2012-2013 Depto. Ciencia de la Computación e IA

Sesión 3

18

Experto Universitario Java Enterprise
Especialista Universitario Java Enterprise

Validadores

• Se encargan de que los datos introducidos tengan los
valores esperados.

Componentes de presentación

© 2012-2013 Dep