Chapter 27

JavaServer Pages and Servlets


Chapter Goals

A Simple JSF Program

A Simple JSF Program

A Simple JSF Program

Executing the datetime Web Application


File datetime/index.jsp

The JSF Container Rewrites the Requested Page


A Simple JSF Program

The HTML Code That Is Generated by a JSF Page


A Simple JSF Program

File datetime/WEB-INF/faces-config.xml

A Simple JSF Program

Important Design Principle of the JSF Technology

Steps for Deploying a JSF Application

  1. Make a subdirectory with the name of your web application in the webapps directory of your Tomcat installation
    /usr/local/jakarta-tomcat/webapps/datetime
    or
    c:\Tomcat\webapps\datetime
  2. Place the index.jsp file into that directory
  3. Create a subdirectory WEB-INF in your application directory
    /usr/local/jakarta-tomcat/webapps/datetime/WEB-INF
    or
    c:\Tomcat\webapps\datetime\WEB-INF

Steps for Deploying a JSF Application

  1. Place faces-config.xml into the WEB-INF subdirectory
  2. Place your Java classes (if any) inside WEB-INF/classes
  3. Place the file web.xml inside the WEB-INF subdirectory
  4. Start the web server
  5. Point your browser to http://localhost:8080/datetime/index.faces

The Directory Structure of the datetime Application


The Java Studio Creator Tool


File datetime/WEB-INF/web.xml

Self Check

  1. What steps are required to add the image of a clock to the datetime application? (The clock doesn't have to show the correct time.)
  2. Does a Swing program automatically separate presentation and business logic?

Answers

  1. Place an image file, say clock.gif, into the datetime directory, and add a tag <img src="clock.gif"/> to the index.jsp file.
  2. No–it is possible (and sadly common) for programmers to place the business logic into the frame and component classes of the user interface.

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components

JavaBeans Components: An Example

JavaBeans Components: An Example

JavaBeans Components: An Example

JavaBeans Components: An Example

The timezone Application


File timezone/WEB-INF/classes/bigjava/TimeZoneBean.java

File timezone/WEB-INF/faces-config.xml

File timezone/index.jsp

The Directory Structure of the timezone Application


Self Check

  1. Is the Random class a Java bean?
  2. What work does the setCity method of the TimeZoneBean do besides setting the city instance field?
  3. When you start the timezone application for the first time, why does the input field contain the string "Los Angeles"?

Answers

  1. Technically, yes. It has a default constructor. However, it has no methods whose name start with get or set, so it exposes no properties.
  2. It sets the zone instance field to match the time zone of the city.
  3. When the zone bean was constructed, its city property was set to "Los Angeles". When the input field is rendered, its default value is the current value of the city property.

Session State and Cookies


JSF Components

JSF Components: Button Groups and Menus

Example: Using a Map to Describe a List of Choices

Common JSF Components

Component JSF Tag Common Attributes Example
Text Field h:inputText value
Password Field h:inputSecret value
Text Area h:inputTextArea value
rows
cols
Radio Button Group h:selectOneRadio
h:selectManyRadio
value
layout
Checkbox h:selectOneCheckbox value
Checkbox Group h:selectManyCheckbox value
layout
Menu h:selectOneMenu
h:selectManyMenu
value
Image h:graphicImage value
Submit Button h:commandButton value
action

Self Check

  1. Which JSF components can be used to give a user a choice between "AM/PM" and "military" time?
  2. How would you supply a set of choices for a credit card expiration year to a h:selectOneMenu component?

Answers

  1. h:selectOneRadio, h:selectOneMenu, or h:selectOneCheckbox
  2. You would need a bean with a property such as the following:
    public Map<String, Integer> getYearChoices()
    {
       Map<String, Integer> choices = new TreeMap<String, Integer>();
       choices.put("2003", 2003);
       choices.put("2004", 2004);
       . . .
       return choices;
    }
    Then supply a tag <f:selectItems value="#{creditCard.yearChoices}"/>.

Navigation Between Pages

Navigating Between Pages


Navigation Between Pages

Navigation Between Pages

Navigation Between Pages

Self Check

  1. What tag would you need to add to error.jsp so that the user can click on a button labeled "Help" and see help.jsp? What other changes do you need to make to the web application?
  2. Which page would be displayed if the addCity method returned null?

Answers

  1. Add the tag <h:commandButton value="Help" action="help"/> to error.jsp, and add a navigation rule to faces-config.xml:
    <navigation-case>
       <from-outcome>help</from-outcome>
       <to-view-id>/help.jsp</to-view-id>
    </navigation-case>
  2. The current page would be redisplayed.

A Three-Tier Application

Three-Tier Architecture


Two-Tier Client-Server Architecture


A Three-Tier Application

A Three-Tier Application

File multizone/misc/CityZone.sql

The CityZone Table


A Three-Tier Application

A Three-Tier Application

<DefaultContext>
   <Resource name="jdbc/mydb" auth="Container" type="javax.sql.DataSource"/>
   <ResourceParams name="jdbc/mydb">
      <parameter>
         <name>factory</name>
         <value>org.apache.commons.dbcp.BasicDataSourceFactory</value>
      </parameter>
      <parameter>
         <name>driverClassName</name>
         <value>driver class</value>
      </parameter>
      <parameter>
         <name>url</name>
         <value>database URL</value>
      </parameter>
      <parameter>
         <name>username</name>
         <value>database user name</value>
      </parameter>
      <parameter>
         <name>password</name>
         <value>database user password</value>
      </parameter>
   </ResourceParams>
</DefaultContext>

A Three-Tier Application

A Three-Tier Application

The Directory Structure of the multizone Application


File multizone/index.jsp

File multizone/next.jsp

File multizone/error.jsp

File multizone/WEB-INF/classes/bigjava/TimeZoneBean.java

File multizone/WEB-INF/faces-config.xml

Self Check

  1. Why don't we just keep a database connection as an instance field in the TimeZoneBean?
  2. Why does the removeCity method of the TimeZoneBean return null or "back", depending on the size of the cities field?

Answers

  1. Then the database connection would be kept open for the entire session.
  2. As long as there are cities, the next.jsp page is redisplayed. If all cities are removed, it is pointless to display the next.jsp page, so the application navigates to the index.jsp page.