Tutorial for JSF JavaServer Faces by Chandrakala Rondla Under guidance of Dr C C Lee Introduction JavaServer Faces is a framework for building Web applications using Java JavaServer Faces provides the following main features Page navigation specification Standard user interface components like input fields buttons and links User input validation Easy error handling Java bean management Event handling Internationalization support JSF provides the common plumbing for any Web application allowing the developer to concentrate on the specific application instead of worrying about things like how to create a link from one page to another Description The tutorial gives brief introduction about JSF and explains the Life Cycle of JSF Also the tutorial will take through the process that involves developing building deploying and running a sample JSF application Life Cycle of JSF JSF handles HTTP requests with seven distinct phases as shown in Figure 1 The normal flow of control is shown with solid lines whereas dashed lines show alternate flows depending on whether a component requests a page redisplay or validation or conversion errors occur When a client makes a request for the page the lifecycle starts During the lifecycle JSF implementation must build the view while considering the state changed from the previous postback When the client performs a postback of the page JSF implementation must perform the Lifecycle steps 1 Validation 2 Conversion Figure 1 The JavaServer Faces lifecycle Lifecycle handles two different types of requests 1 Initial Request A user requests the page for the first time Lifecycle only executes Request tree view and Render response phases 2 Postback A user submits a form contained on a page that was previously loaded in the browser as a result of executing a initial request Lifecycle executes all phases Developing the application from scratch As a start the following are required JDK 1 4 minimum Ant Tomcat 5 0 or any other servlet container Tomcat is used in this example Go to the webapps directory where apache was installed opt apache tomcat 5 5 17 webapps This is where the application resides Create a directory which is your project name Example jsfProject Under jsfProject create the following directory structure ant build xml JavaSource WebContent WEB INF classes lib jsf impl jar jsf api jar faces config xml web xml pages The different parts of the skeleton structure are described below The jsfProject is the project folder which is also the project name The ant folder holds Ant build scripts including a default build xml file The JavaSource folder is where the Java source classes and properties files are placed The WebContent folder holds the actual Web application files used by the application server or servlet container The WEB INF folder inside the WebContent folder holds files that are used as part of the runtime Web application but are hidden from the browser The classes folder inside the WEB INF folder holds compiled Java classes along with properties files copied from JavaSource The lib folder inside the WEB INF folder holds libraries required by the application for example third party Jar files jsf impl jar jsf api jar These two files inside the lib folder are library files included with the JavaServer Faces Reference Implementation available at www java sun com website Every JSF application requires these files The web xml file inside the WEB INF folder is the Web Application Deployment Descriptor for the application This is an XML file describing the Servlets and other components that make up the application The faces config xml file inside the WEB INF folder is the JavaServer Faces configuration file This file lists bean resources and navigation rules The pages folder inside the WebContent folder holds JSP and HTML presentation pages Steps to develop sample JSF application Before we start it is important that directory structure explained above has been created The following steps are involved in developing the sample application Each step is then explained in more detail 1 Create JSP pages 2 Define a navigation rule 3 4 5 6 7 8 Create a managed bean Create a properties file Edit JSP pages Create an index jsp file Compile the application Deploy and run the application 1 Creating JSP Pages Create the inputname jsp and greeting jsp files in WebContent pages 2 Navigation The navigation rule for this application is described in the faces config xml file In this application the controller switches from inputname jsp to greeting jsp The rule says that from the view page inputname jsp go to the view page greeting jsp if the outcome of executing inputname jsp is greeting navigation rule from view id pages inputname jsp from view id navigation case from outcome greeting from outcome to view id pages greeting jsp to view id navigation case navigation rule 3 Creating the Managed Bean Next create com edu HelloWorld folders inside the JavaSource folder Inside the HelloWorld folder create a PersonBean java file It s a simple Java bean with oneattribute and setter getter methods The bean simply captures the name entered by a user after the user clicks the submit button This way the bean provides a bridge between the JSP page and the application logic Please note that the field name in the JSP file must exactly match the attribute name in the bean Put this code in the PersonBean java file package com edu HelloWorld public class PersonBean String personName public String getPersonName return personName public void setPersonName String name personName name Declaring the Bean in faces config xml Now the second part of faces config xml describes Java bean that was created in the previous steps This section defines a bean name PersonBean The next line is the full class name com edu HelloWorld PersonBean request sets the bean scope in the application managed bean managed bean name personBean managed bean name managed bean class com edu HelloWorld PersonBean managed bean class managed bean scope request managed bean scope managed bean The final faces config xml file should look like this xml version 1 0 DOCTYPE faces config PUBLIC Sun Microsystems Inc DTD JavaServer Faces Config 1 1 EN http java sun com dtd web facesconfig 1 1 dtd faces config navigation rule from view id pages inputname jsp from view id navigation case from outcome greeting from outcome to view id pages greeting jsp to view id navigation case navigation rule managed bean managed bean name personBean