Jsf
Upcoming SlideShare
Loading in...5
×
 

Jsf

on

  • 2,756 views

 

Statistics

Views

Total Views
2,756
Slideshare-icon Views on SlideShare
2,756
Embed Views
0

Actions

Likes
2
Downloads
84
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Jsf Jsf Presentation Transcript

    • Introducción JSF (Java Server Faces)
    • Temario
      • Que es JSF
      • MVC en JSF
      • Ciclo de vida JSF
      • FacesContext
      • Lo nuevo de JSF 2
      • Implementación JSF
    • Que es JSF
      • Framework de componentes de usuario en el lado del servidor, para aplicaciones java basadas en entorno WEB.
      • Permite la construcción de aplicaciones como se realiza en Java Swing o .NET.
      • Implementa patrón MVC.
      • Compuesto por :
        • Api java
        • Librerias de Tag
        • Faces Servlet
        • Archivo de configuración
    • MVC en JSF (simple) Faces-config.xml Managed Bean XHTML 1 2 3 4
    • MVC en JSF
      • Vista ( V )
        • JSP (JSF 1.0, 1.1, 1.2) - XHTML (JSF 2.0)
        • Tags JSF
        • Facelets
        • Validators
        • Converters
      • Controlador ( C )
        • faces-config.xml
      • Modelo ( M )
        • Managed Bean
    • JSP Y XHTML en JSF (Vista)
      • JSP (Java Server Pages).
      • XHTML surge como un lenguaje cuyo etiquetado es más estricto que HTML y se basa en XML
      • Ambas son compiladas y enviadas al browser como HTML
    • Tags
      • Librerias de Tag predifinidos JSF
        • <%@ taglib uri=“http://java.sun.com/jsf/html” prefix=“h” %>
          • <h:outputText value= &quot;#{bean.propiedad}&quot;>
          • <h:outputLink value= “http://www.google.cl&quot;>
          • <h:inputText value= &quot;#{bean.email}&quot; id=&quot;email&quot;/>
          • <h:commandButton action=&quot;#{bean.metodo}&quot; value=“Enviar&quot; />
        • <%@ taglib uri=“http://java.sun.com/jsf/core” prefix=“f” %>
          • <f:view>
          • <f:convertDateTime pattern= &quot;dd/MM/yyyy HH:mm:ss&quot;></f:convertDateTime>
          • <f:ajax render= “div_repintar&quot; onevent=“jsBeginSuccessComplete&quot; execute=“idElemento&quot; event=&quot;click“ listener= &quot;#{bean.metodoAjax}&quot;/> (Desde JSF2)
      • Tag Personalizados
        • Ejemplo: https://repo.imit.cl/svn/Desarrollo/BancoChile/src/BCHComponentesComunesInternet/trunk/ComponenteCajaDesafio/CajaDesafio
    • Expresiones EL
      • Lenguaje de expresiones sencillas para acceder a los JavaBeans
      • Es utilizado para
        • Evaluación de expresiones
          • <h:outputText value= &quot;#{bean.propiedad}“ rendered=“#{bean.propiedad != null and bean.propiedad != ‘’}”>
        • La capacidad de establecer, así como obtener datos
          • <h:outputText value= &quot;#{bean.propiedad}&quot;>
        • La capacidad de invocar los métodos
          • <h:commandButton action=&quot;#{bean.metodo}&quot; value=“Enviar&quot; />
    • Facelets (Vista)
      • Framework para plantillas (templates) centrado en la tecnología JSF.
      • Desde JSF 2.0, forma parte de la especificación y es el utilizado por defecto.
    • Validators (Vista)
      • Mecanismo que provee JSF para la validación de datos
      • Implementan javax.faces.validator.Validator
      • Se produce antes de que los valores se asignen al bean (actualización del modelo) y justo después realizadas las conversiones
      • Validadores pre-definidos y personalizados.
      <h:inputText id= &quot;textoFin&quot; value=&quot;#{charlaBean.textoFin}&quot;> <f:validateLength minimum= &quot;1&quot; maximum=&quot;10&quot;></f:validateLength> </h:inputText> <h:message for= &quot;textoFin&quot;></h:message>
    • Converters (Vista)
      • Mecanismo que provee JSF para la conversión de datos (String a Object o viceversa)
      • Implementan javax.faces.convert.Converter
      • Se ejecutan antes de la validación de los datos, (si no cumple - ConversionException)
      • Converters pre-definidos y Personalizados
      XHTML <h:outputText value= &quot;#{charlaBean.fecha}&quot;> <f:convertDateTime pattern= &quot;dd/MM/yyyy HH:mm:ss&quot; timeZone=&quot;Chile/Continental&quot;></f:convertDateTime> </h:outputText> BEAN public class CharlaBean { private Date fecha; ……
    • Managed-bean (Modelo)
      • Clases Java que se asocian con las paginas a través de sus propiedades(get y set) y métodos(action, ajax).
      • Gestionados por el contenedor JSF.
      • Definido en faces-config.xml(jsf 1.2 y 2).
      • Definido en misma clase con anotaciones @ManagedBean en JSF 2
      • Definidos para distintos ámbitos (scope), tales como request, session o view(jsf 2)
    • Faces-config.xml (Controlador)
      • <?xml version= &quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?>
      • <faces-config
      • xmlns= &quot;http://java.sun.com/xml/ns/javaee&quot; xmlns:xsi= http://www.w3.org/2001/XMLSchema-instance xsi:schemaLocation= &quot;http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd&quot;
      • version= &quot;2.0&quot;>
      • <managed-bean>
      • <managed-bean-name>cartolaCtaCteBean</managed-bean-name>
      • <managed-bean-class>cl.bch.internet.personas.ccol.beans.principal.CartolaCtaCteBean</managed-bean-class>
      • <managed-bean-scope>request</managed-bean-scope>
      • </managed-bean>
      • <navigation-rule>
      • <display-name> cartolas/ctacte/liquidacionInteresescrem.xhtml</display-name>
      • <from-view-id>/ cartolas/ctacte/liquidacionInteresescrem.xhtml</from-view-id>
      • <navigation-case>
      • <from-outcome>error</from-outcome>
      • <to-view-id>/BancodeChile.htm</to-view-id>
      • </navigation-case>
      • </navigation-rule>
      • </faces-config>
    • Ciclo de vida JSF
    • FacesContext
      • Clase que sirve de puente hacia el exterior
      • Permite acceder al contexto JSF (otros Beans) y al contexto HTTP (request que se ejecuta)
      • FacesContext ctx=FacesContext.getCurrentInstance();
    • Lo nuevo de JSF 2
      • Utilización de anotaciones, (faces-config.xml prescindible)
      • Soporte nativo para Ajax
      • Definición de componentes utilizados por composición (Facelets).
      • Las ultimas 2 características NO están disponibles usando JSP.
    • Implementación JSF (Crear aplicación Web)
    • Implementación JSF (faces-config.xml) WEB-INF/web.xml <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*. xhtml</url-pattern> </servlet-mapping> WEB_INF/faces-config.xml
    • Implementación JSF (agregar librerías comunes, Java Build Path) https:// repo.imit.cl/svn/Desarrollo/BancoChile/src/BCHComponentesComunesInternet/trunk/BCHCommonsLibraries
    • Implementación JSF (agregar librerías comunes, weblogic.xml)
      • <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;>
      • <html xmlns= &quot;http://www.w3.org/1999/xhtml&quot;
      • xmlns:ui= &quot;http://java.sun.com/jsf/facelets&quot;
      • xmlns:h= &quot;http://java.sun.com/jsf/html&quot;
      • xmlns:f= &quot;http://java.sun.com/jsf/core&quot;>
      • <h:head>
      • <title> Charla JSF</title>
      • </h:head>
      • <body>
      • <h:form id= &quot;myformTalonario&quot; name=&quot;myformTalonario&quot;>
      • <h:commandButton action= &quot;#{charlaBean.terminarCharla}&quot; value=&quot;Fin de Charla&quot; />
      • </h:form>
      • </body>
      • </html>
      Implementación JSF (creación charla.xhtml)
      • <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;>
      • <html xmlns= &quot;http://www.w3.org/1999/xhtml&quot;
      • xmlns:ui= &quot;http://java.sun.com/jsf/facelets&quot;
      • xmlns:h= &quot;http://java.sun.com/jsf/html&quot;
      • xmlns:f= &quot;http://java.sun.com/jsf/core&quot;>
      • <h:head>
      • <title> Charla JSF</title>
      • </h:head>
      • <body>
      • <table width= &quot;100%&quot; >
      • <tr ><td align= &quot;center&quot; valign=&quot;middle&quot;>
      • <table>
      • <tr>
      • <td> Curso: </td>
      • <td><h:outputText value= &quot;#{charlaBean.charla}&quot;></h:outputText>: </td>
      • </tr>
      • <tr>
      • <td> Expositor: </td>
      • <td><h:outputText value= &quot;#{charlaBean.expositor}&quot;></h:outputText>: </td>
      • </tr>
      • <tr>
      • <td> Asistentes: </td>
      • <td><h:outputText value= &quot;#{charlaBean.asistentes}&quot;></h:outputText>: </td>
      • </tr>
      • <tr>
      • <td colspan= &quot;2&quot;><h:outputText value=&quot;#{charlaBean.gracias}&quot;></h:outputText>: </td>
      • </tr>
      • </table>
      • </td></tr>
      • </table>
      • </body>
      • </html>
      Implementación JSF (creación fin_charla.xhtml)
      • package cl.imagemaker.bean;
      • public class CharlaBean {
      • private String charla;
      • private String expositor;
      • private String asistentes;
      • private String gracias;
      • public CharlaBean() {
      • }
      • public String terminarCharla(){
      • this.setCharla(&quot;Charla introductoria JSF&quot;);
      • this.setExpositor(&quot;Pablo Munoz&quot;);
      • this.setAsistentes(&quot;Imagemaker&quot;);
      • this.setGracias(&quot;Muchas gracias, por asistir&quot;);
      • return &quot;ok&quot;;
      • }
      • public String getCharla() {return charla;}
      • public void setCharla(String charla) {this.charla = charla;}
      • public String getExpositor() {return expositor;}
      • public void setExpositor(String expositor) {this.expositor = expositor;}
      • public String getAsistentes() {return asistentes;}
      • public void setAsistentes(String asistentes) {this.asistentes = asistentes;}
      • public String getGracias() {return gracias;}
      • public void setGracias(String gracias) {this.gracias = gracias;}
      • }
      Implementación JSF ( creación CharlaBean.java )
      • <?xml version= &quot;1.0&quot; encoding=&quot;UTF-8&quot;?>
      • <faces-config
      • xmlns= &quot;http://java.sun.com/xml/ns/javaee&quot;
      • xmlns:xsi= &quot;http://www.w3.org/2001/XMLSchema-instance&quot;
      • xsi:schemaLocation= &quot;http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd&quot;
      • version= &quot;2.0&quot;>
      • <managed-bean>
      • <managed-bean-name>charlaBean</managed-bean-name>
      • <managed-bean-class>cl.imagemaker.bean.CharlaBean</managed-bean-class>
      • <managed-bean-scope>request</managed-bean-scope>
      • </managed-bean>
      • <navigation-rule>
      • <display-name>charla.xhtml</display-name>
      • <from-view-id>/charla.xhtml</from-view-id>
      • <navigation-case>
      • <from-outcome> ok</from-outcome>
      • <to-view-id>/fin_charla.xhtml</to-view-id>
      • </navigation-case>
      • </navigation-rule>
      • </faces-config>
      Implementación JSF ( faces-config.xml )
    • Introducción JSF
      • FIN