lecture 10 - java server faces (jsf)
TRANSCRIPT
Java Server Faces
Fahad R. Golra
ECE Paris Ecole d'Ingénieurs - FRANCE
Lecture 8 - Java Server Faces (JSF)
• Introduction to JSF • JSF Architecture • JSF Lifecycle • JSF Development Steps
2 JEE - Java Server Faces (JSF)
3 Layers of Information System
3 JEE - Java Server Faces (JSF)
presentation layer
application logic layer
resource management layer
Client
info
rmat
ion
syst
em
EJB
JSP JSF
Servlets
JPA
Database
Java Server Faces
• JavaServer Faces technology is a server-side user interface component framework for Java technology-based web applications.
4 JEE - Java Server Faces (JSF)
Components of JSF
• An API for • representing UI components and managing their state • handling events • server-side validation • data conversion • defining page navigation • supporting internationalisation and accessibility
• Two JavaServer Pages (JSP) custom tag libraries for expressing UI components within a JSP page and for wiring components to server-side objects
5 JEE - Java Server Faces (JSF)
Why JSF ?
• Drop components onto a page by adding component tags
• Wire component-generated events to server-side application code
• Bind UI components on a page to server-side data
• Construct a UI with reusable and extensible components
• Save and restore UI state beyond the life of server requests
6 JEE - Java Server Faces (JSF)
Request Scope
7 JEE - Java Server Faces (JSF)
client
Serverrequestresponse Request Scope
requestresponse Request Scope
client 2
requestresponse Request Scope
per r
eque
stpe
r req
uest
Session Scope
8 JEE - Java Server Faces (JSF)
client
Serverrequestresponse
Session Scoperequestresponse
client 2
requestresponse Session Scope
per c
lient
per c
lient
Application Scope
9 JEE - Java Server Faces (JSF)
client
Serverrequestresponse
Application Scope
requestresponse
client 2
requestresponse
per a
pplic
atio
n
JSF Architecture
10 JEE - Java Server Faces (JSF)
JSF User Interface
• The UI for the web application manages the objects referenced by the JSP page.
• These objects include • The UI component objects that map to the tags on the JSP page • Any event listeners, validators, and converters that are registered on the
components • The JavaBeans components that encapsulate the data and application-
specific functionality of the components
11 JEE - Java Server Faces (JSF)
JSF Lifecycle
12 JEE - Java Server Faces (JSF)
Client Browser
client
Restore Value Re-constitute component
tree
Apply Request Values
Process Events, Validators
Render Response Invoke Application Logic
Update Model Values
Restore View Phase
• JSF implementation • builds the view of the page • wires event handlers and validators to components in the
view • saves the view in the FacesContext instance
• Initial Request - creates an empty view, advances to the render response phase
• Subsequent Request - restores the (already existing) view by using the state information saved on the client or the server
13 JEE - Java Server Faces (JSF)
Apply Request Values Phase
• Each component in the tree extracts its new value from the request parameters by using its decode method
• Implementation skips to the render response phase if renderResponse is called
• If events have been queued, the they are broadcasted to interested listeners
• validation, conversion, and events associated with components having immediate attributes will be processed during this phase
14 JEE - Java Server Faces (JSF)
Process Event, Validators Phase
• JavaServer Faces implementation processes all validators registered on the components in the tree
• If validation fails, error message is added to FacesContext • Events from previous phase and this phase are used to render
errors by advancing to render response phase
• Implementation skips to the render response phase if renderResponse is called
• If events have been queued, the they are broadcasted to interested listeners
15 JEE - Java Server Faces (JSF)
Update Model Values Phase
• If data is valid, the implementation can traverse the component tree and set the corresponding server-side object properties to the components’ local values.
• Implementation will update the bean properties pointed at by an input component’s value attribute.
• Implementation skips to the render response phase to display any error messages
• If events have been queued, the they are broadcasted to interested listeners
16 JEE - Java Server Faces (JSF)
Invoke Application Logic Phase
• JSF implementation handles any application-level events, such as submitting a form or linking to another page
• If the view being processed was reconstructed from state information from a previous request and if a component has fired an event, these events are broadcast to interested listeners.
17 JEE - Java Server Faces (JSF)
Render Response Phase
• JSF implementation delegates authority for rendering the page to the JSP container if the application is using JSP pages. • For initial request, the components represented on the page
will be added to the component tree • components don’t need to added again for subsequent
requests • Components will be rendered as the JSP container
traverses the tags in the page. • queued error messages are displayed, if any • Once rendered, the state of the response is saved so that
subsequent requests can access it
18 JEE - Java Server Faces (JSF)
UI Components
• UIComponent/UIComponentBase • Base class for all user interface components
• Standard UIComponent Subclasses • UICommand, UIForm, UIOutput • UIGraphic, UIInput, UIPanel, UIParameter • UISelectBoolean, UISelectMany, UISelectOne
• Example <h:inputText id=“fNameInput" value="#{UserRegistrationBean.firstName}"/>
19 JEE - Java Server Faces (JSF)
JSF Validators
• Validators—Perform correctness checks on UIInput values • Register one or more per component • Enqueue one or more messages on errors • Standard implementations for common cases
• Example <h:input_text valueRef=”testingBean.today” <f:validator_length minimum=”6” maximum='10” />
20 JEE - Java Server Faces (JSF)
JSF Converters
• Converters—Plug-in for conversions: • Output: Object to String • Input: String to Object • Standard implementations for common cases
• Example <h:input_text valueRef=”testingBean.today” convertor=”DateTime”/>
21 JEE - Java Server Faces (JSF)
Navigation
• Application developer defines the navigation model of the web application • in Application configuration file (Facesconfig.xml)
• Navigation rules • Determine where (page) to go. • Precise navigation case
22 JEE - Java Server Faces (JSF)
JSF Development Steps
1. Build Model from Java Beans • Lifetime Configured by developer and managed by JSF • Request, Session, or Application Scope • Setters and getters accessed through JSF pages
2. Add model objects (managed bean) declarations to Application Configuration File faces-config.xml
3. Use UI Components to build JSF pages • Include JSF Tags, Validation and Event Listeners
4. Define Page Navigation rules in faces.config.xml 5. Configure web.xml
23 JEE - Java Server Faces (JSF)
Step 1 - Build Model
• The model (M) in MVC • A regular JavaBeans with getters / setters • May contain application methods and event handlers • Use to hold data from a UI (page) • Creation and lifetime is managed by JSF runtime
• application, session, request • JSF keeps the bean's data in sync with the UI
24 JEE - Java Server Faces (JSF)
Step 2 - Declare Model Objects
• In Faces-config.xml <managed-bean>
<managed-bean-name> LoginFormBean
</managed-bean-name>
<managed-bean-class> myapp.LoginFormBean
</managed-bean-class>
<managed-bean-scope> request
</managed-bean-scope> </managed-bean>
25 JEE - Java Server Faces (JSF)
Step 3 - Create JSF Pages
• Must include JSF tag library • HTML and core tags
• All JSF tags must enclosed between a set of view tag • Use JSF form and form component tags
• <h:input_text> not <input type=”text”> • <h:command_button> not <input type=”submit”>
• May include validators and event listeners on any form components
26 JEE - Java Server Faces (JSF)
Step 3 - Create JSF Pages
<f:view> <f:form formName=”logonForm”>
<h:panel_grid columns=”2”> <h:output_text value=”Username:”/> <h:input_text id=”username” length=”16” valueRef=”logonBean.username”/>
<h:output_text value=”Password:”/> <h:input_secret id=”password” length=”16” valueRef=”logonBean.password”/>
<h:command_button type=”submit” label=”Log On” actionRef=”logonBean.logon”/>
<h:command_button type=”reset” label=”Reset”/> </h:panel_grid>
</f:form> </f:view>
27
Step 4 - Define Navigation
<navigation-rule> <from-tree-id> /login.jsp </from-tree-id>
<navigation-case> <from-outcome>success</from-outcome> <to-tree-id>/menu.jsp</to-tree-id>
</navigation-case>
<navigation-case> <from-outcome>failed</from-outcome> <to-tree-id>/error.jsp</to-tree-id>
</navigation-case> </navigation-rule>
28 JEE - Java Server Faces (JSF)
Step 5 - Configure Web.xml
<context-param> <param-name>
javax.faces.application.CONFIG_FILES </param-name> <param-value>/WEB-INF/faces-config.xml </param-value>
</context-param> <servlet>
<servlet-name>Faces Servlet</servlet-name> <servlet-class> javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup> 1 </load-on-startup>
</servlet> <!-- Faces Servlet Mapping --> <servlet-mapping>
<servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern>
</servlet-mapping>
29 JEE - Java Server Faces (JSF)
JSF vs. JSP for UI
30
JSF JSP
Components • Rich UI-data-bound components with events provided
• Custom components
• Standard tags (JSTL) that are non-UI and very basic
• Custom components through tag libraries
Device independence
• Reader kits that provide device independence
• None
Error handling and validation
• Validation framework • Many predefined validators
• None
Scripting • Scripts can be attached to events
• All components accessible from scripts
• Embedded Java in the page
Page flow • Simple navigation file (faces-config.xml)
• None
31 JEE - Java Server Faces (JSF)