ONJava.com -- The Independent Source for Enterprise Java
oreilly.comSafari Books Online.Conferences.

advertisement

AddThis Social Bookmark Button

Using JSF

by Andrei Cioroianu
09/03/2003

The JavaServer Faces (JSF) technology provides standard APIs and tag libraries needed by Java developers that build web-based user interfaces. Craig McClanahan, the author of the Apache Struts framework, co-leads the JSF project at Sun. This will ensure an easy migration from the popular Apache project to the JSF standard. Like the Struts framework, JSF defines a set of JSP tags that generate HTML form elements that can be bound to JavaBean properties. From the application developer's perspective, the two frameworks are similar, but JSF will probably get more support from tool developers, because it is a Java standard. In the future, all J2EE application servers might actually be required to support JavaServer Faces.

Sun has recently released its Java Web Services Developer Pack 1.2, which includes a reference implementation (Early Access 4 — EA4) of the JSF Specification (Version 1.0, Public Review Draft 2). The EA4 version implements new features such as actions, managed beans, and navigation rules. This article focuses on these new features and shows how to take advantage of JSF in order to build forms, validate user input, and bind user interface components to JavaBean properties.

Related Articles:

Introducing JavaServer Faces -- JavaServer Faces, or JSF, is heralded as the next step in server-side programming. It promises to make your life easier, your programs more maintainable, and maybe even your job more enjoyable. Budi Kurniawan demonstrates JSF, explaining why it's useful and if it lives up to its promises.

This article contains a web application made of four main components. A JavaBean class (PBean.java) acts as a data model, holding some text and its attributes: font, size, color, alignment, etc. A JSF-based form (edit.jsp) allows users to provide values for the properties of the JavaBean. Another Java class (PBuilder.java) generates an HTML paragraph with the given text and attributes. Finally, a JSP page (view.jsp) shows the generated paragraph.

The JSF-based form
Figure 1. The JSF-based form

Building the JSF Form

Source Code

Download the source code for this example application.

Handling HTML forms is one of the most common tasks when you develop web applications. A good framework can save a lot of development time because there are many routine operations that can be done automatically, or reduced to just a few declarations in an XML file. It is also possible to simplify web development using well-designed JSP tag libraries. The JavaServer Faces framework provides JSP tags for rendering HTML forms, manages the state of the forms, validates user-input reporting errors, lets you bind user interface components to JavaBean properties, and does many other things that increase your productivity. JSF also has a rich API that you can use to build custom user interface (UI) components, custom validation classes (validators), and server-side event listeners.

JSF contains two tag libraries called JSF Core and HTML Basic. The former provides a few general tags and some other tags that let you register validators and event listeners to UI components. The latter contains JSP tags that render HTML UI components such as buttons, text fields, checkboxes, lists, etc. The edit.jsp page uses many of these tags to build its form. The standard prefixes of these two tag libraries are f and h, and they are declared at the beginning of edit.jsp:

<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %>

The <f:use_faces> tag is a container tag that must enclose all other JSF tags that are used in a page. It doesn't generate any HTML content, but it triggers internal JSF mechanisms. The <h:form> tag generates a <form> HTML element that can contain UI components.

<html>
<head>
<title>Edit</title>
</head>
<body>

<f:use_faces>
    <h:form formName="pform">
    ..........
    </h:form>
</f:use_faces>

</body>
</html>

The above JSP code generates the following HTML fragment:

<html>
<head>
<title>Edit</title>
</head>
<body>
    <form method="post" action="/usingjsf/faces/edit.jsp">
    ..........
    </form>
</body>
</html>

The next section describes the JavaBean model of the application.

Managed Beans

Like many other web frameworks, JSF separates the user interface from the model objects that encapsulate data and application logic. When the HTML user interface is generated with the JSF tags, the JSF framework gets the data from the JavaBean model and sets the state of the UI components that make the HTML form. When the user submits the form, JSF validates the user input. If everything is okay, JSF stores the user input in the JavaBean model and the HTTP request can be forwarded to another page following a "navigation rule." If there are validation errors, JSF returns the form with error messages, so that the user can correct the input errors.

The PBean class follows the JavaBean patterns, implementing java.io.Serializable and providing get and set methods for its properties: text, size, font, color, align, bold, italic, and underline. For each user of the application, JSF creates a PBean instance that is stored within the session JSP scope with the pbean ID as specified in an XML configuration file named faces-config.xml. JSF also initializes the properties of the JavaBean instances with the values that are provided in faces-config.xml. This XML file may contain other JSF configuration parameters, including the navigation rules, which are explained later in the article.

The following XML fragment contains the declarations related to the JavaBean that is managed by JSF:

<?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>
    ..........
    <managed-bean>
        <managed-bean-name>pbean</managed-bean-name>
        <managed-bean-class>
            com.devsphere.articles.usingjsf.PBean
        </managed-bean-class>
        <managed-bean-scope>session</managed-bean-scope>
        <managed-property>
            <property-name>text</property-name>
            <null-value/>
        </managed-property>
        <managed-property>
            <property-name>size</property-name>
            <value>3</value>
        </managed-property>
        <managed-property>
            <property-name>font</property-name>
            <values>
                <value>Arial</value>
                <value>Courier New</value>
            </values>
        </managed-property>
        <managed-property>
            <property-name>color</property-name>
            <value>green</value>
        </managed-property>
        <managed-property>
            <property-name>align</property-name>
            <value>left</value>
        </managed-property>
        <managed-property>
            <property-name>bold</property-name>
            <value>false</value>
        </managed-property>
        <managed-property>
            <property-name>italic</property-name>
            <value>true</value>
        </managed-property>
        <managed-property>
            <property-name>underline</property-name>
            <value>false</value>
        </managed-property>
    </managed-bean>
</faces-config>

The managed beans that are created by JSF can be stored within the request, session, or application scopes, depending on the value of the <managed-bean-scope> element, which may also contain none. JSF will not create a JavaBean instance if an object is already registered within the given scope with the given ID.

Pages: 1, 2, 3, 4

Next Pagearrow