|[ Team LiB ]|
An Overview of JavaServer Faces (JSF)
JavaServer Faces (JSF) is new technology, still in its early specification stages. The brain behind Struts, Craig McClanahan, is specification co-lead for JavaServer Faces (JSR 127). You can get an early reference implementation of this technology from Sun's Web site at
The JSF technology is targeted at simplifying the development of the user interface or View layer of an MVC application. JavaServer Faces technology includes a collection of APIs that represent various UI components and know how to handle events, perform user input validation, and carry out things such as the state, navigation, and internationalization. JSF also comes with a rich tag library that allows developers to leverage the JSF functionality from a JavaServer Page.
JSF provides a rich set of graphical user interface (GUI) components that use the concept of "renderers" that allow the GUI components to be rendered differently. A UI that is created using JSF runs on the server and renders backs to a target client, which could be a JSP or something else.
Figure 21.2 shows how a JavaServer Faces request works.
The easy-to-use JSF API promotes the creation of custom UI components as needed for your application. The tag libraries that come with JSF allow you to render the various GUI components in an HTML format.
JSF replaces several of the Struts tag libraries and provides a cleaner separation and handling of the UI-related tasks and objects. In Struts, you only have the ability to render UI components as HTML. In addition, Struts supports only the basic HTML form components. With JSF, you can design and use a much richer set of UI components and use them uniformly, whether you have a JSP-based client or some other client. You can very easily modify your Struts-based JavaServer Pages to leverage JSF, without any change to the action classes and the rest of the Struts infrastructure.
Struts and JSF Integration
JSF Life Cycle
Before you look at an example, it is important to understand the life cycle of a JSP request. JSF also has the concept of a single servlet that handles all faces requests. A faces request is one that has some faces components. This request is initiated through the submission of a JSF form or a link to an URL with the /faces prefix. The FacesServlet handles all faces requests. A faces request can return a faces or a non-faces response.
There are six phases in the JSF life cycle:
In the JavaServer Faces Reference Implementation (JSF-RI), each of these phases is supported by a class with the same name. Figure 21.3 shows the JSF life cycle. The dotted lines show alternate flows through the cycle. We will discuss each phase in detail.
Reconstitute Request Tree
The "reconstitute request tree" phase is initiated when a user clicks a link or a button that has some faces components. During this phase, the JSF needs to do the following:
Apply Request Values
In the "apply request values" phase, each bean updates its value based on the information in the request. Any errors are put into the FacesContext. Events that might occur are sent to the appropriate listeners.
In the "process validations" phase, all validations are executed. Validators perform validations against all the attributes and add any error messages to the FacesContext. If there are error messages, you should jump directly to the "render response" phase.
Update Model Values
At this point, you know you have valid values. Now components having valueRef expressions are updated. This is quite similar to the "apply request values" phase.
All application level events are handled during this phase. JSF executes the action specified in the actionRef tags.
During this phase, JSF renders the component tree saved in the FacesContext, and this can be in a format such as HTML. This is also cached to improve performance.
JSF UI Components
JSF makes it very easy to create custom UI components. However, out of the box, it has support for the following standard components:
A Sample JSF Application
Let's modify the sample Struts application to use JavaServer Faces. As we said earlier, you can modify just the JSP and leave the rest of the application almost as is.
Listing 21.6 shows the login JSP that uses JavaServer Faces.
<%@ page contentType="text/html; charset=UTF8" %> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <%@ taglib uri="http://java.sun.com/jstl/fmt" prefix="fmt" %> <f:use_faces> <h:form id="loginForm" formName="loginForm" > <h:input_text id="username" valueRef="User.username"> <f:validate_required/> <h:input_text/> <h:input_text id="password" valueRef="User.password"> <f:validate_required/> <h:input_text/> <h:command_button id="submit" action="success" label="Login" commandName="submit" > <f:action_listener type="jspBook.LoginFormActionListener"/> </h:command_button> <h:command_button id="reset" action="reset" label="Reset" commandName="reset" /> <h:output_errors/> </h:form> </f:use_faces> </body> </html>
You will need a faces-config.xml file, quite similar to the struts-config.xml file that we discussed earlier. Listing 21.7 shows this file.
Listing 21.7 shows the faces-config.xml configuration file.
<?xml version="1.0"?> <!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN" "http://java.sun.com/dtd/web-facesconfig_1_0.dtd"> <faces-config> <navigation-rule> <from-tree-id>/loginPageUsingJSF.jsp</from-tree-id> <navigation-case> <from-outcome>success</from-outcome> <to-tree-id>/mainMenuUsingJSF.jsp</to-tree-id> </navigation-case> </navigation-rule> <managed-bean> <managed-bean-name>User</managed-bean-name> <managed-bean-class> jspBook.User </managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean> </faces-config>
You will need to modify your struts-config.xml file to leverage JSF. Listing 21.8 shows that change.
<form-bean name="User" type="jspBook.User "/> <action-mappings> <action path="/Login" type="LoginUserAction" name="LoginUserForm" scope="request" input="/faces/loginPageUsingJSF.jsp"> <forward name="success" path="/faces/mainMenuUsingJSF.jsp"/> </action> </action-mappings>
To enable faces, you will need to modify your web.xml file. This is shown in Listing 21.9.
<!-- JavaServer Faces Servlet Configuration --> <servlet> <servlet-name>faces</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <!-- JavaServer Faces Servlet Mapping --> <servlet-mapping> <servlet-name>faces</servlet-name> <url-pattern>/faces/*</url-pattern> </servlet-mapping>
|[ Team LiB ]|