Basics and Concepts of Java Server Faces

Basics and Concepts of Java Server Faces A standard approach to web- development Martin Marinschek IRIAN Solutions GmbH (http:/ / www.irian.at) Submission ID 2220 2 AGENDA 1. Why JSF? 2. JSF – an introduction 3. Standard components of JSF 4. JSF – the LifeCycle 5. JSF Libraries and Add- On Frameworks 6. Outlook to the future of JSF 3 AGENDA 1. Why JSF? 2. JSF – an introduction 3. Standard components of JSF 4. JSF – the LifeCycle 5. JSF Libraries and Add- On Frameworks 6. Outlook to the future of JSF Java and its Standards! 4 1995 199619971998199920002001200220032004200520062007 JSP Standard Tag Library (JSTL) 1.0 1.1 1.2 JavaServer Pages (JSP) 0.92 1.0/ 1.1 1.2 2.0 2.1 Java- Servlets 1.0 2.0 2.1/ 2.2 2.3 2.4 2.5 Java 1.0 1.1 1.2 1.3 1.4 5.0 6.0 5 Why JSF? Rendering was already standardized > JSP, Servlets, JSTL Two- way- binding and form- handling missing A host of frameworks filled this GAP Ja va- Web- Frameworks 6 WebOnSwing Swinglets JPublishEcho Millstone JSPWidget JoSssporing MVC Wicket DWR Sofia WebworkJucas Maverick VRaptor Struts Japple Stripes AnvGil WT Barracuda CocoonJAT TRaIFpEestry Verge JaffOapenXava ChrysSawliisngWeb http:/ / www.java- source.net/ open- source/ web- frameworks Java and its Standards! 7 1995 199619971998199920002001200220032004200520062007 JavaServer Faces (JSF) 1.0/ 1.1 1.2 JSP Standard Tag Library (JSTL) 1.0 1.1 1.2 JavaServer Pages (JSP) 0.92 1.0/ 1.1 1.2 2.0 2.1 Java- Servlets 1.0 2.0 2.1/ 2.2 2.3 2.4 2.5 Java 1.0 1.1 1.2 1.3 1.4 5.0 6.0 8 AGENDA 1. Why JSF? 2. JSF – an introduction 3. JSF – the LifeCycle 4. Standard components of JSF 5. JSF Libraries and Add- On Frameworks 6. Outlook to the future of JSF 9 JSF in a nutshell • JSF is a … • ... new framework for building highly interactive web- apps with a simple and clear role- model • ... component- based framework • ... event- driven framework • … stateful framework on top of stateless protocols • ... RAD (Rapid Application Development) enabling platform • ... JCP standard! 10 Component driven framework • JSF has built- in components • connect components inside a view- definition- file • (JSP, Facelets,..) • the ‚rendering‘ transforms these to markup like (X)HTML <h:inputText id="x" /> <input type="text" id="form:x"/> 11 Event driven framework registers at triggers Event- Event- Source Listener creates Event sent to 12 JSF – a technology in wide use IRIAN.at- JSF- Projects: > Deutsche Bank > Continentale > IPI.ch > OeKB > ICW AG > Erste Bank > Raiffeisen Capital Management Other JSF- Projects in Switzerland (we know of): > Credit Suisse If you have one, come to the Swiss JSF- user group meeting today in the evening! > More information at the end of this presentation… Apache MyFaces > „Companies using Apache MyFaces“ http:/ / wiki.apache.org/ myfaces/ Companies_Using_MyFaces 13 A JSF – Hello World example h:panelGrid h:outputLabel h:inputTex t h:commandButto n 14 A JSF page needs… View- Template – e.g. JSP: <f:view> <h:outputLabel value=„label for=„id“/> <h:inputText id=„id“ value=„#{myBean.text}“/> </f:view> One or more Backing- Beans (Managed- Beans) public class MyBean {} Configuration in faces-config.xml: <managed-bean> <managed-bean-name>myBean</managed-bean- name> </managed-bean> 15 JSF- JSP- Template - Hello World <html>..<f:view><h:form id="form"> <h:panelGrid columns="2"> <h:outputLabel for="input1" value="first name"/> <h:inputText id="input1„ value="#{customer.firstname}"/> <h:outputLabel for="input2" value="second name"/> <h:inputText id="input2" value="#{customer.secondname}" required="true" /> <h:commandButton value="send it!" action="#{customer.send}"/> <h:messages errorStyle="color:red"/> </h:panelGrid> </h:form></f:view>..</html> 16 JavaBean – Hello World public class Customer { private String firstname = null; private String secondname = null; //getter and setter public String send(){ //back-end access (e.g. BusinessDelegate) return "fine"; } } 17 Faces- config.xml – Hello World <faces-config> <managed-bean> <managed-bean-name>customer</managed-bean-name> <managed-bean-class>foo.Customer</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> <navigation-rule> <from-view-id>/form.jsp</from-view-id> <navigation-case> <from-outcome>fine</from-outcome> <to-view-id>/output.jsp</to-view-id> </navigation-case> </navigation-rule> </faces-config> 18 AGENDA > Why JSF? > JSF – an introduction > Standard components of JSF > JSF – the LifeCycle > JSF Libraries and Add- On Frameworks > Outlook to the future of JSF 19 standard components - Text • output of text - outputText <h:outputText value="#{user.userNameDescr}"/> • input of text - inputText <h:inputText value="#{user.userName}"/> • password input <h:inputSecret/> • hidden field (yes, you won’t need it anymore): <h:inputHidden/> • textareas <h:inputTextarea/> 20 standard components - UICommand • commandLink <h:commandLink action="#{actionBean.test}"/> • commandButton <h:commandButton action="#{pageBean.test2}"/> 21 standard components - OutputLink • Linking to websites/ web- apps outside of JSF: <h:outputLink value=„url“ target=„_blank“/> • Caution: state gets lost, since this is not a postback • HTTP parameters <h:outputLink value=„url“> <f:param name=„allowCache“ value=„true“/> </h:outputLink> 22 standard components – UIData • best for presenting structured data (like java.util.List) • horizontal: every column is defined by a UIColumn component • vertical: each row represents one item of the structured data • Facets (<f:facet/>) allow defining header and footer 23 standard components - UIData <h:dataTable value="#{bean.items}" var="item"> <h:column> <h:outputText value="#{item.name}"/> </h:column> <h:column> <f:facet name="header"> <h:outputText value="Header 2"/> </f:facet> <h:outputText value="#{item.desc}"/> </h:column> </h:dataTable> 24 Switching Master- Detail setPropertyActionListener (preparation) navigation Item 25 Switching Master- Detail - Code That‘s it: <h:dataTable> <h:column> <h:commandLink action="edit" > <f:setPropertyActionListener value="#{item}" target="#{itemEdit.currentItem}"/> </h:commandLink> </h:column> </h:dataTable> 26 Standard components - Label • Label for a component: <h:outputLabel for="myId" value="#{bean.labelText}"/> <h:inputText id="myId" value="something"/> Apache MyFaces Tomahawk: • label text can be used in message • use <t:outputLabel/> for this 27 Standard components - SelectMany <h:selectManyCheckbox> <h:selectManyListbox/> 28 Standard components - SelectOne <h:selectOneRadio> <h:selectOneListbox/> <h:selectOneMenu/> 29 Example - JSP SelectOneMenu for choosing gender of a person: <h:selectOneMenu value="#{person.gender}"> <f:selectItems value="#{person.genderItems}"/> </h:selectOneMenu> Person.java: private String gender; //getter+setter private List genderItems; public List getGenderItems(){ if(genderItems == null){ genderItems = new ArrayList(); genderItems.add(new SelectItem("m","male",null)); genderItems.add(new SelectItem("w","female",null)); } return genderItems; } 30 MyFaces Tomahawk: t:selectItems Select- Item- List could also be created automatically: <t:selectItems var="person" value="#{bean.persons}" itemLabel="#{person.name}" itemValue="#{person.id}"/> 31 AGENDA > Why JSF? > JSF – an introduction > Standard components of JSF > JSF – the LifeCycle > JSF Libraries and Add- On Frameworks > Outlook to the future of JSF 32 JSF Request Lifecyle Response complete Faces Apply Conversion Restore Process request Request and View Events Response Values Validation P e r complete v o T e c n e N Render Response t s s s E I Response Response U M L complete complete p o d C d a e t e Faces l Render Process Invoke Process respons e Response Events Application Events Conversion Errors Render Response Validation / Conversion Errors Render Response 33 JSF Lifecycle – Initialization Faces Apply Conversion Restore Process request Request and View Events Values Validation P e r v o T e c n e N t s No view available s s E I U M L p o d C d a e t e l Faces Render Process Invoke Process respons e Response Events Application Events Create View 34 JSF Lifecycle – Validation fails Faces Apply Conversion Restore Process request Request and View Events Values Validation P e r v o T e c n e N t s s s E I U M L p o d C d a e t e l Faces Render Process Invoke Process respons e Response Events Application Events Validation / Conversion Errors Render Response JSF Lifecycle – Input Values 35 same way validation error validation ok a) If UICom.submittedValue = = null - > use ManagedBean.attribute 36 PhaseListener - configuration • JSF provides a special listener for the lifecycle • PhaseListener executed at the beginning and at the end of a phase. • register in faces- config.xml: <lifecycle> <phase-listener> org.apache.training.DebugPhaseListener </phase-listener> </lifecycle> 37 PhaseListener - Sample public class DebugPhaseListener implements PhaseListener { public void beforePhase(PhaseEvent event){} public void afterPhase(PhaseEvent event){ System.out.println("afterPhase"); } public PhaseId getPhaseId(){ return PhaseId.ANY_PHASE; // return PhaseId.INVOKE_APPLICATION; } } 38 AGENDA > Why JSF? > JSF – an introduction > Standard components of JSF > JSF – the LifeCycle > JSF Libraries and Add- On Frameworks > Outlook to the future of JSF J SF – implementations and add- on 39 fIrmapmlemeewntoatrioknss > Sun RI > Apache MyFaces (founded by Thomas Spiegl and Manfred Geiler, both IRIAN.at) Extensions/ other frameworks on top of the standard > Apache MyFaces orchestra (glue code for JSF – Spring – JPA, conversation support) >

Basics and Concepts of Java Server Faces

Details

Download

Copyright

We respect the copyrights and intellectual property rights of all users. All uploaded documents are either original works of the uploader or authorized works of the rightful owners.

Support