1 / 17

Dynamikken i JSF

Dynamikken i JSF. Hvordan hænger JSF sammen?. I dette kapitel ser vi på hvordan de forskellige dele af JSF hænger sammen og samarbejder på runtime. I løbet af kapitlet gennemgår vi en JSF-applikation. Du kan finde denne applikation i projektet: JSF-Ex-Intro-CustomerApplication.

vernon-kidd
Download Presentation

Dynamikken i JSF

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Dynamikken i JSF

  2. Hvordan hænger JSF sammen? • I dette kapitel ser vi på hvordan de forskellige dele af JSF hænger sammen og samarbejder på runtime. • I løbet af kapitlet gennemgår vi en JSF-applikation. Du kan finde denne applikation i projektet: JSF-Ex-Intro-CustomerApplication

  3. Det store overblik JSF-WebApp http-req Faces Servlet faces-config.xml Browser Managed JavaBeans Managed JavaBeans Managed JavaBeans JSP/Facelets med JSF-UI JSF TagLibs Validators http-resp Events Messages Forretningslogik, fx EJB eller Business Delegate

  4. Et eksempel på en JSF-applikation • I det følgende gennemgås en simpel applikation, som simulerer oprettelsen af en kunde. hvis alt går godtender vi her men af og til simulererprogrammet en fejl og vi enderher i stedet

  5. Et eksempel på en JSF-applikation • Applikationen består af følgende elementer • web.xml, som bl.a. registerer FacesServlet • 3 views (implementeret både som Facelets og JSP: createCustomer.xhtml/.jsp, viewCustomer.xhtml/jsp og error.xhtml/.jsp) • en customerBean, som repræsenterer en kunde • en faces-config.xml-fil

  6. Sammenhængen faces-config.xml Controller læser modtager request :FacesServlet tilgår context instantiererpropagerer parametre renderes JSP-sider/ Facelets forwarder JSP-sider/ Facelets :CustomerBean name=”Peter Jensen”... Model View læser

  7. Views – createCustomer.xhtml <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <f:viewcontentType="text/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"> <html> <head><title>Customer Application</title></head> <body> <h1>JSF (Facelets) Demo</h1> <h2>Create customer</h2> <h:form> <h:outputText value="Name" /> <h:inputText value="#{customerBean.name}" /> <br /> <h:outputText value="Password" /> <h:inputSecret value="#{customerBean.password}" /> <br /> <h:outputText value="Important" /> <h:selectBooleanCheckbox value="#{customerBean.important}" /> <br /> <h:commandButton action="#{customerBean.createCustomer}” value="Create Customer" /> </h:form> </body> </html> </f:view>

  8. Views – createCustomer.jsp • <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%> • <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%> • <html> • <head><title>Customer Application</title></head> • <body> • <f:view> • <h1>JSF (JSP) Demo</h1> • <h2>Create customer</h2> • <h:form> • <h:outputText value="Name" /> • <h:inputText value="#{customerBean.name}" /> • <br /> • <h:outputText value="Password" /> • <h:inputSecret value="#{customerBean.password}" /> • <br /> • <h:outputText value="Important" /> • <h:selectBooleanCheckbox value="#{customerBean.important}" /> • <br /> • <h:commandButton action="#{customerBean.createCustomer}" • value="Create Customer" /> • </h:form> • </f:view> • </body> • </html>

  9. Views – viewCustomer.xhtml • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" • "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> • <f:viewcontentType="text/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"> • <html> • <head><title>Customer Application</title></head> • <body> • <h1>JSF (Facelets) Demo</h1> • <h2>View customer</h2> • <h:outputText value="Name" /> • <h:outputText value="#{customerBean.name}" /> • <br /> • <h:outputText value="Password" /> • <h:outputText value="#{customerBean.password}" /> • <br /> • <h:outputText value="Important" /> • <h:selectBooleanCheckbox value="#{customerBean.important}" /> • <h:outputText value="!!!" rendered="#{customerBean.important}" • style="color: red; font-weight: bold;" /> • </body> • </html> • </f:view>

  10. Views – viewCustomer.jsp • <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%> • <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%> • <html> • <head><title>Customer Application</title></head> • <body> • <f:view> • <h1>JSF (JSP) Demo</h1> • <h2>View customer</h2> • <h:outputText value="Name" /> • <h:outputText value="#{customerBean.name}" /> • <br /> • <h:outputText value="Password" /> • <h:outputText value="#{customerBean.password}" /> • <br /> • <h:outputText value="Important" /> • <h:selectBooleanCheckbox value="#{customerBean.important}" /> • <h:outputText value="!!!" rendered="#{customerBean.important}" • style="color: red; font-weight: bold;" /> • </f:view> • </body> • </html>

  11. Model - CustomerBean.java • public class CustomerBean { • String password; • String name; • boolean important; • // getters og setters til 'password' og 'important' står her • public String getName() { return name; } • public void setName(String name) {this.name = name;} • public String createCustomer() { • System.out.println("createCustomer() invoked"); • if (Math.random()<0.5) { • return "success"; • } else { • return "failure"; • } • } • } JSF kan automatisk propagere data mellem UI-komponenter og Managed Beans. value-binding <h:inputText id="name" value="#{customerBean.name}"...>

  12. faces-config.xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE ...> <faces-config> <managed-bean> <managed-bean-name>customerBean</managed-bean-name> <managed-bean-class> dk.lundogbendsen.bean.CustomerBean </managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean> <navigation-rule> <from-view-id>/pages/createCustomer.xhtml</from-view-id> <navigation-case> <from-outcome>success</from-outcome> <to-view-id>/pages/viewCustomer.xhtml</to-view-id> </navigation-case> <navigation-case> <from-outcome>failure</from-outcome> <to-view-id>/pages/error.xhtml</to-view-id> </navigation-case> </navigation-rule> </faces-config> Faces-config.xml-filen beskriver sammenhængen mellem delelementerne i en JSF-applikation. I dette eksempel: • Managed Beans • Navigationsregler

  13. Actions JSF er eventorienteret i modsætning til ’normale’ Web-applikationer, som er request/response-orienterede. Princippet er, at vi laver en Action-metode (en event-listener) som vi registerer på en knap. Action-metoder vil typisk invokere forretningslogik, fx placeret i EJB’er. package dk.lundogbendsen.bean; public class CustomerBean { .... public StringcreateCustomer() { System.out.println("createCustomer() invoked"); if (Math.random()<0.5) { //simulerer en ret ustabil database;-) return "success"; } else { return "failure"; } } ... <h:commandButton action="#{customerBean.createCustomer}" value="Create Customer" /> En action-metode tager ingen parametre og har String som retur-type. Vi har her valgt at placere den i CustomerBean, men den kunne i princippet være placeret i en hvilken som helst Bean.

  14. Navigation • Action-metoder returnerer en String, der fortæller JSFs navigationssystem, hvilken side der skal forwardes til. I faces-config.xml er String-værdier mappet til Facelets og/eller JSP-sider. package dk.lundogbendsen.bean; public class CustomerBean { .... public StringcreateCustomer() { System.out.println("createCustomer() invoked"); // simulerer en ret ustabil database ;-) if (Math.random()<0.5) { return "success"; } else { return "failure"; } } ... Exadel JSFStudios visualisering af faces-config.xml’s navigationsregler

  15. web.xml web.xml i en JSF-applikation vil altid som minimumregistrere FacesServletten og mappe den til en url, fx *.jsf eller /faces/*.

  16. Overblik over applikationen En JSF-applikation er ’blot’ en almindelig web-applikation, som indeholder en række JSF-jar-filer,bestemte entries i web.xml og xml-filer til konfiguration af applikationen.

  17. 1) Et login-skærmbillede Øvelse

More Related