Developing Faces (JSF) applications

Though there are several Web technologies that you can work with to create dynamic Web applications, JavaServer Faces (JSF) gives you the ability to create form-based applications easily. Several views allow you to easily implement JavaServer Faces technology in your Web application: the Page Data view (shows the defined data sources), the Enhanced Faces Components drawer, Standard Faces Components drawer, and Faces Client Components drawer in the Palette view (lets you easily add user interface (UI) components and define data sources together for the page), and the data drawer in the Palette view (lets you define new data sources and drag data components such as JavaBeans™ and relational record lists to the page).
Note: Some Faces Client Components and Client Data have been deprecated and are not recommended for use.
The following have been deprecated and are not recommended for use:
  • Client Data and its associated tooling (such as the Client Data view)
  • Faces Client Components
    • <odc:dataGrid> (Data Grid)
    • <odc:webService> (Web Service)
    • <odc:clientData>
    • <odc:clientBinder>

To create a JSF application:

  1. Creating a Faces enabled Web project. The Web project is the container for all of your Web application resources. (Note that Faces JSP files can be contained only within a J2EE 1.3 or a J2EE 1.4 dynamic Web project.)
    Remember: To enable the Web project for JSF technology, specify the Faces Project configuration on the first page of the New Project wizard.
    If you add any Faces resources to your Web project, the Faces tooling is automatically enabled.
  2. Create Faces JSP files in that project. A JSF enabled JSP file becomes a Web page in your dynamic Web project.
  3. Add data components to the JSP file. From the Data drawer on the Palette view, drag a component to your Web page. You can add general data components, such as Java™ beans or Web services, or you can add relational database records.
    • There are two relational record components you can work with:
      • A single relational record: This component returns a single relational record and the properties of the record are generally bound to input or output components. v
      • A relational record list: This component returns a list of relational records and can be bound to a data table or other component. It can also display elements from a JavaBean array and be bound to a JavaBean array.
      The advantage of using relational records and relational record lists is that you can retrieve, create, update, or delete information from a relational database and that this information can optionally be bound for display to the end user.
    • If you want to use Java beans or Web services, drag these items from the Page Data view or from the Data drawer on the palette.
    By default, when you add a data component from the palette, two things happen:
    • The data source is defined (and appears in the Page Data view).
    • The appropriate Faces components are added to the page for use with the defined data sources when Add data controls or Add input/output controls is selected.

      These Faces components are bound to the defined data source. For instance, a data table may be added to a Web page if a relational record list is used. A table of components may be added to a Web page if a relational record is used. Each field in the relational record is represented as a row in the table. The components that are contained within each row depend on the types of data being added and how the user intends to use the relational record within the Web page (that is, for creating, updating, or displaying).

  4. Continue to design your page by dragging other JSF components from the palette to the page. You can drop components such as input fields, command buttons, hyperlinks, tabbed panels, and media players.
  5. Edit the properties for each component. When you have focus on a component in the Design or Source page of Page Designer, the Properties view displays the properties available for that component. If you add a Faces component directly from the palette, you can bind the component to a defined data source in the Properties view for the component.
  6. Use the Quick Edit view to add scripted events to your Web pages. For example, you can assign actions to Faces components in your Faces JSP file.
  7. Test your JSP files periodically as you develop your pages using Faces components. Because Faces components use dynamic data, you should run on server to preview. The preview page (located on the tab at the bottom of the Faces JSP file) will not be as accurate.
  8. Run the Web project on the server. In the Project Explorer, right-click the file and select Run As > Run on Server. Refer to the server documentation to learn more about testing and deploying your Web application.
At run time, HTML and form tags are produced. After the Web application is deployed, the user can access and manipulate data directly from the Web application.
Restriction: To link to a Faces JSP file from a HTML file change the referenced filename from <filename>.jsp to <filename>.faces in the HTML page. Do not rename the actual Faces JSP file extension. When you change the referenced link to a .faces extension in the HTML file, Links Builder will not work.

To learn more about displaying dynamic information in JSF enabled Web pages, do the following tutorial:

Tutorial: Display dynamic information on Web pages with JavaServer Faces. This tutorial will teach you how to design a dynamic Web site that functions as a newspaper's classified advertising section. The Web site is a complete J2EE Web application that uses JavaServer Faces (JSF) components and Service Data Objects (SDO) components. The Web application uses JSF technology to create dynamic Web pages that link to a database that stores classified advertising data.Tutorial: Display dynamic information on Web pages with JavaServer Faces. This tutorial will teach you how to design a dynamic Web site that functions as a newspaper's classified advertising section. The Web site is a complete J2EE Web application that uses JavaServer Faces (JSF) components and Service Data Objects (SDO) components. The Web application uses JSF technology to create dynamic Web pages that link to a database that stores classified advertising data.

Related tasks
Adding a JSF facet to a Web application

Feedback