Struts Tutorials:
Struts2 Tag CheckBoxList
, Checkbox, Iterator, IF
Struts2 Tag Library Example
Struts2 Tiles Example
Struts2 Tiles I18N Example
Struts2 Questions
Struts Tiles I18N Example
Struts Eclipse MVC
Struts2 Tags
Struts2 Example and Tutorial
Struts MVC
Struts2 Validation



Hibernate Tutorials:
Hibernate Case Study
Class Hierarchy Persist Example
Using Hibernate Interceptor
Hibernate Questions with Answer
Hibernate Many-to-Many Mapping Example
Hibernate one-to-many Mapping Example
Hibernate and ORM tools
Spring Hibernate Example
Hibernate SessionFactory Example
Hibernate Mapping Class Hierarchy
Hibernate Questions
Hibernate SessionFactory Questions

Spring Hibernate Example:
Spring Hibernate Case Study

Written By : Amit
Title :
Tag Library

Description :
Demo code required
More...

Written By : Amit
Title :
Interview Questions answer

Description :
Add Your Questions on Servlet and JSP
More...

Written By : Amit
Title :
JSF Example

Description :
Simple Tutorial
More...

Written By : Amit
Title :
JSF Validation

Description :
Simple Tutorial
More...

Written By : Amit
Title :
JSF Tag

Description :
Simple Tutorial
More...

Tags/Keywords : JSF Example, JSF Tutorial, JSF Article, simple, example
Author : Amit
Date (Year/Month/Date): 2009-08-16
JSF Simple Example and Tutorial :

Please be informed that NONE of the design/code from this
page is claiming to be some sort of best practices and we DO NOT expect
any of our visitor/reader of this page to assume this as some sort of
best practice for any context and should not be using this 
as it is without appropriate evaluation to their, so to say, 
specific programming context.

This page intends only to provide bit and piece of known ways  for
doing some sort of example and may not be fit for any other purpose.


A very simple example to show how to use JSF (version 1.0) for a web application
with only two screens.

Software environment I have used for this example, so far as follows:
1. JDK 5.0.x
2. Tomcat 5.5.x
3. Eclipse 3.2
4. Apache Tomcat 6.0.18
5. List of JAR files used for this example as as follows:
   5.1. commons-beanutils.jar
   5.2. commons-collections.jar
   5.3. commons-digester.jar
   5.4. commons-logging.jar
   5.5. jsf-api.jar
   5.6. jsf-impl.jar
   5.7. jstl.jar
   5.8. standard.jar



Advertisement : 



One screen is to accept user input and the other one is the preview
screen.

Various components used in this example are as follows:
list of JAR files in WEB-INF/lib folder as 

1. web.xml file for setting up FacesServlet
2. faces-config.xml file for the defining managed bean and navigational
   rules and many more.
3. Managed bean to receive submit button click and values from the
   screen text fields.
4. index screen and preview screen.

Some form of layout showing major components of this example


web.xml file

<?xml version="1.0" encoding="ISO-8859-1"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
   http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
   version="2.5"> 
  <servlet>
    <servlet-name>JSF-FacesServlet</servlet-name>
	<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>JSF-FacesServlet</servlet-name>
	<url-pattern>*.jsf</url-pattern>
  </servlet-mapping>
</web-app>


faces-config.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE faces-config PUBLIC 
  "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"
  "http://java.sun.com/dtd/web-facesconfig_1_0.dtd">
<faces-config>
 <managed-bean>
   <managed-bean-name>SampleMGMTBean</managed-bean-name>
   <managed-bean-class>
       sample.ButtonEventCapture
   </managed-bean-class>
   <managed-bean-scope>request</managed-bean-scope>
 </managed-bean>
 <navigation-rule>
   <navigation-case>
     <from-outcome>preview</from-outcome>
	 <to-view-id>/preview.jsf</to-view-id>
   </navigation-case>
 </navigation-rule>
 <application>
 <locale-config/>
 </application>
 <factory/>
 <lifecycle/>  
</faces-config>



Managed bean "ButtonEventCapture.java" file as follows:

package sample;
public class ButtonEventCapture
{
    String txtName;
	String txtPass;

	public void setTxtName(String txtName) {
		this.txtName = txtName;
	}
	public String getTxtName() {
		return txtName;
	}
	public void setTxtPass(String txtPass) {
		this.txtPass = txtPass;
	}
	public String getTxtPass() {
		return txtPass;
	}
	public String submitButton() {
		System.out.println("Submit button is clicked...");
        System.out.println("Name: "+txtName);
		System.out.println("Pass: "+txtPass);
		return "preview";
	}
	public String cancelButton() {
        System.out.println("Cancel button is clicked...");
		return null;
	}
}


This class does nothing except, printing name and pass on console
and then sending render value as "preview".

This "preview" is defined in the faces-config.xml file and
the corresponding to-view-id is set to the preview.jsp file.

This is to be noted that if the URL has *.jsf as file extension
then automatically same file name with jsp extension will be called
to render output.

Now let us look at the index.jsp file:

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="sampleHtml" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="sampleCore" %>
<html>
<body>
<h4>Enrollment form:</h4>
<sampleCore:view>
  <sampleHtml:form>
    <table>
     <tr><td>Name :</td><td><sampleHtml:inputText
	 value="#{SampleMGMTBean.txtName}"/></td></tr>
     <tr><td>Pass :</td><td><sampleHtml:inputSecret
	 value="#{SampleMGMTBean.txtPass}"/></td></tr>
     <tr><td><sampleHtml:commandButton value="Submit"
	 action="#{SampleMGMTBean.submitButton}"/></td>
     <td><sampleHtml:commandButton value="Cancel"
	 action="#{SampleMGMTBean.cancelButton}"/></td></tr>
    </table>
  </sampleHtml:form>
</sampleCore:view>
</body>
</html>



and the next page is preview.jsp file:

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="sampleHtml" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="sampleCore" %>
<html>
<body>
<h4>Preview</h4>
<sampleCore:view>
  <sampleHtml:form>
    <table>
     <tr><td>Name :</td><td><sampleHtml:outputText  
                   value="#{SampleMGMTBean.txtName}"/></td></tr>
     <tr><td>Pass :</td><td><sampleHtml:outputText  
                   value="#{SampleMGMTBean.txtPass}"/></td></tr>
    </table>
  </sampleHtml:form>
</sampleCore:view>
</body>
</html>


This is a very simple example to show how basic JSF components can be
used for navigation and request and response flow using HTTP and
input text being captured in the server side managed bean.

In order to run this example using browser, the URL is

http://localhost:8080/JSF-Sample/index.jsf
Here the web address is localhost, web application name is
JSF-Sample, If you try to use index.jsp or / at the end of this URL,
you may encounter error on page, as mentioned in the web.xml
file, the servlet URL mapping refers to *.jsf

More complex example will follow soon. Please keep reading and commenting
to improve.



Advertisement : 





Author of this article/writeup has expressed his/her willingness
to help or guide users with any technical difficulties he/she faces
while working with the example code environment setting up, running
and resolving any such exception raised during compile or at runtime.
You may ask for any technical doubt or seek technical help related to
this article by using following form to reach for technical help
from the Author for FREE.

This article's Author shall be reading your request and responding
within reasonable time (no resolution timeframe defined as such).

Copyright © 2008-2009, Interview-Questions-Tips-Forum, All Rights Reserved.