Creating and testing Faces portlets

JavaServer Faces (Faces) is a technology that allows you to build JSP pages containing prebuilt user interface components (Faces components). JSP pages containing Faces components can be included in Web applications or portlets. There is a JSP custom tag library to support the use of the Faces components.

Rational Developer provides users with the ability to drag Faces components onto a JSP page and configure them for use by their Web application or portlet. To create and test a JavaServer Faces portlet...

Note: For more detailed instructions, use the topic links provided.

1. Create a Faces portlet project.

   1. Select File > New > Project. Then, select the Portlet Project or Portlet Project (JSR 168) option on the right, and then click the Next button.

   2. Specify a name and location for the project. You can also click the Show Advanced button to change other project-level settings.

   3. Select the Faces portlet radio button.

   4. You can click Next if you wish to:
      • Include additional Web Project features, such as the JSP Standard Tag Library (JSTL).

      • Change the application name or portlet name.

      • Change the default locale (language) and title.

      • Change the package or class prefix.

      • Add Edit, Help or Configure modes to your portlet (View is automatically added, but can be deselected).

   5. Click Finish. The wizard will create a portlet project, and open the Portlet Deployment Descriptor, as well as the JSP file for the View mode (by default). If you included Edit, Help or Configure modes, a JSP for each is also created. The default names of these JSPs are projectNameView.jsp, projectNameEdit.jsp, projectNameHelp.jsp, projectNameConfigure.jsp, respectively.

2. Create Faces portlet JSP files. Create additional JSP files that will be used as input and output form pages in your application, for example.

   1. Select File > New > Faces JSP File from the project's context menu in the Project Explorer. The New Faces JSP File wizard will open.

   2. Provide a name for the JSP file, and the appropriate Model type for your portlet.

   3. Optionally, select the Configure advanced options check box to add tag libraries, specify encoding, content type, and document type information, and generate method stubs for the JSP file.

   4. Click Finish. The JSP file, with appropriate markup, is created and automatically opened in the Page Designer editing pane.

3. Add data access for components to your portlet. For each of the JSP files in your portlet, double-click on the file in the Project Navigator view. This opens the JSP file in Page Designer. From the Data drawer on the Palette view or the Page Data view, drag and drop a component to your portlet JSP files.

   By default, Faces components appropriate for the types of data being added are also added to the JSP file. These Faces components are bound to the defined data source. For instance, a data table can be added to a portlet page by dropping bean properties from the Page Data view.

   1. You can add general data components, such as Java beans and Web Services. If you want to use Java beans or Web services, drag and drop these items from the Page Data view or from the Data drawer on the Palette, and complete the appropriate wizards.

   2. A table of components may be added to a portlet 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 portlet page (that is, for creating, updating, or displaying). If you want to add relational records that use WDO, there are two Faces components you can work with:
      • Relational Record - This component returns a single relational record and can be bound to a data table or other component.

      • Relational Record List - This component returns a list of relational records and can be bound to a data table or other component.

      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.

      Note: Currently, use of the Relational Record and Relational Record List components in Faces portlets is provided for prototyping purposes only. When you drag and drop one of these components, a warning message to this effect is displayed.

4. Customize the Faces portlets. You can drag-and-drop reusable UI components, such as input fields, command buttons, hyperlinks, tabbed panels, and media players to your portlet JSP files.

   Note: In the JSP editing environment (Page Designer), most of the development steps that involve adding and configuring Faces components are identical in the standard Faces and Faces portlet models.

   1. If necessary, open the JSP files in your portlet by double-clicking on them in the Project Explorer view.

   2. Add Faces components. A drawer that includes Faces Components appears in the palette to the right of the Page Designer window. Select a component and drag it onto the JSP file's Design or Source view. The tagging to support that component is added to the JSP file. For details about adding specific components, see the following topics:
      • Adding input components to a Faces JSP page

      • Adding and configuring a data table

      • Adding selection lists to a Faces JSP file

      • Adding hyperlinks to a Faces JSP file

      • Using navigation rules with Faces JSP pages

   3. Configure the Faces components.
      • Highlight the component in the Page Designer window.

      • In the Properties view, make sure the component you want to modify is displayed in one of the Properties view. The types of settings vary, depending on the type of Faces component you are editing. See Attributes for Faces components for a description of attributes that you can set using the component's properties view

   4. Adding scripted events to Web pages. For example, you can assign actions to Faces components in your Faces JSP pages.

   5. Add support for inter-portlet messaging, using the instructions in Developing cooperative portlets or Faces direct portlet messaging, if needed. You can also add people awareness support (see Adding people awareness to portlet JSP files ) to extend the communication capabilities of your portlet to individuals in a collaborative environment.

   6. Add supporting text and images. After adding and configuring the Faces components, add any additional text and images using HTML or other JSP tagging.

5. Test your portlet

   1. In the Project Explorer view, right-click the portlet project and select Run > Run on Server.

   2. In the Server Selection wizard, select a WebSphere Portal Test Environment.

   3. Click Finish. The WebSphere Portal Test Environment will start, then display your portlet in the browser window.

 

Related concepts

Developing cooperative portlets

 

Related tasks

Adding people awareness to portlet JSP files
Inserting images in portlet JSP files
Testing, debugging, or profiling portlets
Defining servers for testing portlets