Alchemist

introduction JSF part 3 : Configuring and Running the Application

July 30, 2008 at 12:01 am (Uncategorized)

Set the IDE to display greeting.jsp when it runs the application and, finally, test the application.

1. In the Projects window, right-click the project node and choose Properties.
2. Click the Run node and type /faces/greeting.jsp in the Relative URL field. This allows you to specify the entry point for the application in the IDE. Click OK.
3. Right-click the project node and choose Run (F6). The IDE builds the project, starts the application server, deploys the application, and shows the following page in the default external browser:

When you click the Submit button, you see the following:

Note: Because you have changed the entry point for the application to greeting.jsp, you can now delete welcomeJSF.jsp, which was generated by default when the project was created. The page is not required for this tutorial, nor follow-up tutorials.

Hooking up a Backing Bean

In the previous section you created a simple web application with JSF components. However, the web application does not really do anything – yet. In order to add rich functionality to JSF web applications, you can associate UI components with backing beans. A backing bean, also called a JSF managed bean, is a regular JavaBeans component whose bean properties and methods are available to the JSF components.

In this section, you create a UserBean managed bean that will expose two bean properties: name and birthday.

1. In the Projects window, right-click the project node and choose New > Other (Ctrl-N). Under the JavaServer Faces category, select the JSF Managed Bean template and click Next.
2. Name the bean UserBean and create a new package named astrologer.user to put it in. Leave the rest of the settings at their default values and click Finish.

The IDE opens UserBean.java in the Source Editor and adds the following bean declaration to faces-config.xml:

——————————————————————–

<managed-bean> <managed-bean-name>UserBean</managed-bean-name>

<managed-bean-class>astrologer.user.UserBean</managed-bean-class>

<managed-bean-scope>request</managed-bean-scope>

      </managed-bean>
      ------------------------------------------------------------------------------

3.  Add the following field declarations (shown in bold) to UserBean.java:

      public class UserBean {

        String name;
        String birthday;

4.  Generate getters and setters for the fields: right-click anywhere in the file and choose Refactor > Encapsulate Fields. In the dialog box that        displays, select getter and setter options for both name and birthday, then click Refactor.

The IDE switches the access level for the fields to private and creates getter and setter methods directly in the file

5.  In greeting.jsp, make the following changes (shown in bold).

——————————————————————-

       <f:view>
         <h:form>
          <p>Enter your name: <h:inputText value="#{UserBean.name}" /></p>
          <p>Enter your birthday: <h:inputText value="#{UserBean.birthday}" /></p>
          <h:commandButton value="Submit" action="submit" />
         </h:form>
       </f:view>
       ----------------------------------------------------------------------------

As you enter changes, make use of the IDE’s code completion support for UserBeans.java and its properties by pressing Ctrl-Space and     choosing available options.

6.  Add the JSF taglib declarations to success.jsp. You can copy and paste them from greeting.jsp.

7.  Add an empty JSF form to success.jsp by clicking the JSF Form button in the Palette window (Ctrl-Shift-8) and dragging and it to a point below the <h2> tags in the Source Editor.

8.  Make the following changes to success.jsp (changes in bold):

—————————————————

      <h2>Congratulations</h2>
        <f:view>
          <h:form>
            <p>You've successfully registered with jAstrologer.</p>
            <p>Your name is <h:outputText value="#{UserBean.name}" /></p>
            <p>Your birthday is <h:outputText value="#{UserBean.birthday}" /></p>
          </h:form>
        </f:view>

9.  In the Projects window, right-click the project node and choose Run. The same greeting.jsp page displays in a browser when the application is redeployed and run. When you enter values and click Submit, success.jsp now displays the values you entered, as shown below: