JSF component tree

EGL allows you to dynamically update aspects of JSF controls that are displayed in a Web browser. For example, you can change the color of a text box if the user enters invalid information in that text box. These changes occur on the Web application server, affecting the information available to the JSP that in turn presents the Web page to the browser.

EGL accesses JSF components through the page's JSF component tree, an XML-based structure that identifies the JSF components specified in the JSP file. When using the JSF component tree, you associate an EGL variable with the JSF component you want to access. Then, you can perform the same functions on that EGL variable that you can perform on the JSF component itself, such as changing the style and other properties. For a complete list of the JSF components and the functions that are available for each of those components, see the documentation for Java™ Server Faces at http://java.sun.com/j2ee/javaserverfaces/1.1_01/docs/api/index.html.

In general, you can access the JSF controls on a Web page by following these steps. For more information and a complete example, see Accessing a JSF component from a pageHandler.
  1. Create a EGL Web project with JSF component interface support or add JSF component interface support to an existing EGL Web project. See Adding JSF component interface support to an EGL Web project.
  2. Create a Faces JSP file and add one or more JSF components to it.
  3. In the page's page code file, add the following code. If you created the Faces JSP file after you added support for the JSF component interface to the project, this code is added to the page code file automatically.
    • Add the following import statement:
      import com.ibm.egl.jsf.*
    • Within the page's pageHandler, create a variable of type UIViewRoot.
    • Specify the name of the UIViewRoot variable in the pageHandler property viewRootVar.
  4. Create a variable of the JSF control type you want to access or have the source assistant create one for you. For more information, see Accessing a JSF component with the source assistant. For example, a variable of type HtmlInputText refers to a JSF input field on the page. The following code creates a variable of type HtmlInputText:
    myControl HtmlInputText;
  5. Link the variable to the JSF component, using the UIViewRoot variable. For example, the following code links a variable of type HtmlInputText to a JSF text input field named inputField1 inside a form named form1:
    myControl = myViewRoot.findComponent("form1:inputField1");
  6. Use the variable to change the JSF component. For example, the following code changes the text in an input field to the color red:
    myControl.setStyle("color : red");

Related concepts
viewRootVar property

Related tasks
Adding JSF component interface support to an EGL Web project
Accessing a JSF component from a pageHandler
Changing the style class of a JSF component
Changing the style of a JSF component
Changing the target of a JSF link
Enabling or disabling JSF components
Setting the size of a JSF image
Setting event handlers for a JSF component
Setting JSF data table properties

Related reference
Component tree access parts

Feedback
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.