The Java EE 6 Tutorial

Examining the hello1 Web Module

The hello1 application is a web module that uses JavaServer Faces technology to display a greeting and response. You can use a text editor to view the application files, or you can use NetBeans IDE.

ProcedureTo View the hello1 Web Module Using NetBeans IDE

  1. In NetBeans IDE, select File->Open Project.

  2. In the Open Project dialog, navigate to:


    tut-install/examples/web/
  3. Select the hello1 folder.

  4. Select the Open as Main Project check box.

  5. Expand the Web Pages node and double-click the index.xhtml file to view it in the right-hand pane.

    The index.html file is the default landing page for a Facelets application. For this application, the page uses simple tag markup to display a form with a graphic image, a header, a text field, and two command buttons:

    <?xml version='1.0' encoding='UTF-8' ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html">
        <h:head>
            <title>Facelets Hello Greeting</title>
        </h:head>
        <h:body>
            <h:form>
                <h:graphicImage url="duke.waving.gif"/>
                <h2>Hello, my name is Duke. What's yours?</h2>
                <h:inputText id="username" 
                             value="#{hello.name}"
                             required="true"
                             requiredMessage="A name is required."
                             maxlength="25">
                </h:inputText>
                <p></p>
                <h:commandButton id="submit" value="Submit" action="response">
                </h:commandButton>
                <h:commandButton id="reset" value="Reset" type="reset">
                </h:commandButton>
            </h:form>
        </h:body>
    </html>

    The most complex element on the page is the inputText text field. The maxlength attribute specifies the maximum length of the field. The required attribute specifies that the field must be filled out; the requiredMessage attribute provides the error message to be displayed if the field is left empty. Finally, the value attribute contains an expression that will be provided by the Hello backing bean.

    The Submit commandButton element specifies the action as response, meaning that when the button is clicked, the response.xhtml page is displayed.

  6. Double-click the response.xhtml file to view it.

    The response page appears. Even simpler than the greeting page, the response page contains a graphic image, a header that displays the expression provided by the backing bean, and a single button whose action element transfers you back to the index.xhtml page:

    <?xml version='1.0' encoding='UTF-8' ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html">
        <h:head>
            <title>Facelets Hello Response</title>
        </h:head>
        <h:body>
            <h:form>
                <h:graphicImage url="duke.waving.gif"/>
                <h2>Hello, #{hello.name}!</h2>
                <p></p>
                <h:commandButton id="back" value="Back" action="index" />
            </h:form>
        </h:body>
    </html>
  7. Expand the Source Packages node, then the hello1 node.

  8. Double-click the Hello.java file to view it.

    The Hello class, called a backing bean class, provides getter and setter methods for the name property used in the Facelets page expressions. By default, the expression language refers to the class name, with the first letter in lowercase (hello.name).

    package hello1;
    
    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.RequestScoped;
    
    @ManagedBean
    @RequestScoped
    public class Hello {
    
        private String name;
    
        public Hello() {
        }
    
        public String getName() {
            return name;
        }
    
        public void setName(String user_name) {
            this.name = user_name;
        }
    }
  9. Under the Web Pages node, expand the WEB-INF node and double-click the web.xml file to view it.

    The web.xml file contains several elements that are required for a Facelets application. All these are created automatically when you use NetBeans IDE to create an application:

    • A context parameter specifying the project stage:

          <context-param>
              <param-name>javax.faces.PROJECT_STAGE</param-name>
              <param-value>Development</param-value>
          </context-param>

      A context parameter provides configuration information needed by a web application. An application can define its own context parameters. In addition, JavaServer Faces technology and Java Servlet technology define context parameters that an application can use.

    • A servlet element and its servlet-mapping element specifying the FacesServlet:

          <servlet>
              <servlet-name>Faces Servlet</servlet-name>
              <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
              <load-on-startup>1</load-on-startup>
          </servlet>
          <servlet-mapping>
              <servlet-name>Faces Servlet</servlet-name>
              <url-pattern>/faces/*</url-pattern>
          </servlet-mapping>
    • A welcome-file-list element specifying the location of the landing page; note that the location is faces/index.xhtml, not just index.xhtml:

          <welcome-file-list>
              <welcome-file>faces/index.xhtml</welcome-file>
          </welcome-file-list>