Page History

...

Start the eclipse wizard and right click on the Project Explorer and click on the New -> Dynamic Web Project
Enter the project name as EmployeeWEB and click on the Next button.
On the New Dynamic Web Project wizard, check on the Project Facet checkboxes and select the version values as below screen shot, and click on the Next button.
On the Web Module wizard, make sure that Generate Deployment Descriptor is checked as below and click on the Next button.
On the Geronimo Deployment Plan wizard, provide the moduleId values as below screen shot and click on the Next button.
On the JSF Capabilities wizard, check the second radio button and click on the New button by the side of the combo box. This will open Create JSF Implementation Library wizard.
Provide the Library Name as MyJSFLibrary and add the following jars by clicking on the Add button. Finally, click on the Finish button.
- <geronimo_home>\repository\commons-beanutils\commons-beanutils\1.7.0\commons-beanutils-1.7.0.jar
- <geronimo_home>\repository\commons-collections\commons-collections\3.2\commons-collections-3.2.jar
- <geronimo_home>\repository\commons-digester\commons-digester\1.8\commons-digester-1.8.jar
- <geronimo_home>\repository\commons-logging\commons-logging\1.0.4\commons-logging-1.0.4.jar
- <geronimo_home>\repository\org\apache\myfaces\core\myfaces-api\1.2.6\myfaces-api-1.2.26.jar
- <geronimo_home>\repository\org\apache\myfaces\core\myfaces-impl\1.2.6\myfaces-impl-1.2.26.jar
Now, on the JSF Capabilities wizard, add the URL Mapping Patterns as *.jsf and click on the Finish button.
This will create EmployeeWEB application in the Project Explorer as below screen shot.
Right click on the WEB-INF folder and navigate to New -> Folder and create a folder by name tld as given in the screen shot below.
Copy myfaces_core.tld and myfaces-_html.tld files into the tld folder. These *.tld files are available in the myfaces-impl-1.2.6.jar file.

We are going to use JPA to connect to EmployeeDB database created in the embedded Derby database. JPA uses persistence.xml file for configuration. Create a META-INF folder in the EmployeeWEB -> build -> classes folder in the Project Explorer. The contents of the persistence.xml are as follows.

Code Block

	XML
	XML
borderStyle	solid
title	persistence.xml

<?xml version="1.0" encoding="UTF-8" ?>
<persistence xmlns="http://java.sun.com/xml/ns/persistence"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://java.sun.com/xml/ns/persistence 
 http://java.sun.com/xml/ns/persistence/persistence_1_0.xsd" version="1.0">

 <persistence-unit name="Employee" transaction-type="JTA">  
  <provider>org.apache.openjpa.persistence.PersistenceProviderImpl</provider>
  <non-jta-data-source>EmployeeDS</non-jta-data-source>
 </persistence-unit>
	
</persistence>

...

Right click on the EmployeeWEB project and create index.jsp as follows.

The contents of the index.jsp are as follows.

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	index.jsp

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>
  <a href="/EmployeeWEB/addEmployee.jsf">
    <font size=4 color='blue'>
      Add employee details
    </font></a> <br/>

  <a href="/EmployeeWEB/RetrieveEmployee.jsf">
  <font size=4 color='blue'>
   Edit employee details
  </font></a> <br/>

</body>
</html>

Similarly, create addEmployee.jsp and the contents are as follows.

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	addEmployee.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ page language="java" %>

<%@ taglib uri="/WEB-INF/tld/myfaces-_html.tld"  prefix="h" %>
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld"  prefix="f" %>  

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"
 +request.getServerName()+":"+request.getServerPort()+path+"/";
%>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 
 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" 
 content="text/html; charset=ISO-8859-1">
<base href="<%=basePath%>">

<script type="text/javascript">

</script>
<title>Add employee details</title>
</head> 
<body>

<f:view> 
 <h:form>

 <h:inputHidden id="id" value="#{Employee.empNo}"/>

 <h:panelGrid columns="2" border="0">

 <h:outputText value="Employee No :" />

 <h:inputText id="empNo" 
  value="#{Employee.empNo}" required="true">
 <f:validateLongRange maximum="100000" minimum="1"/>				     
 </h:inputText>


 <h:outputText value="Employee Name :" />

 <h:inputText id="empName" 
 value="#{Employee.empName}" required="true">
 <f:validateLength maximum="100" minimum="2"/>					     
 </h:inputText>

 <h:outputText value="Department Name :" />

 <h:selectOneMenu id="deptName" value="#{Employee.deptName}" 
  required="true" >
  <f:selectItems value="#{Employee.deptOptions}" />
 </h:selectOneMenu>

 <h:outputText value="Sex :" />

 <h:selectOneRadio id="sex" value="#{Employee.sex}" required="true">
 <f:selectItem id="male" itemLabel="Male" itemValue="male" />
 <f:selectItem id="female" itemLabel="Female" itemValue="female" />
 </h:selectOneRadio>

 <h:outputText value="Salary :" />

 <h:inputText id="salary" 
 value="#{Employee.salary}" required="true">
 <f:validateDoubleRange minimum="1000.00" maximum="10000000.00"/>					     
 </h:inputText>

  <h:outputText value="Employee Band :" />

  <h:selectOneListbox id="band" value="#{Employee.band}" size="3" required="true">
  <f:selectItem id="bandA" itemLabel="Band A" itemValue="A" />
  <f:selectItem id="bandB" itemLabel="Band B" itemValue="B" />
 <f:selectItem id="bandC" itemLabel="Band C" itemValue="C" />
 <f:selectItem id="bandD" itemLabel="Band D" itemValue="D" />
  <f:selectItem id="bandE" itemLabel="Band E" itemValue="E" />
  <f:selectItem id="bandF" itemLabel="Band F" itemValue="F" />
  </h:selectOneListbox>


  </h:panelGrid>

  <h:messages id="errors" 
  style="color:red;font-weight:bold" 
  layout="table" />

  <h:commandButton value="Save" 
   action="saveEmployee" 
   actionListener="#{Employee.addEmployee}" />


  </h:form>

 </f:view>

</body>
</html>

Similarly, create editEmployee.jsp and the contents are as follows.

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	editEmployee.jsp

<%@ page language="java" contentType="text/html;
 charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ page language="java" %>

<%@ taglib uri="/WEB-INF/tld/myfaces-_html.tld"  prefix="h" %>
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld"  prefix="f" %>  

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+
  request.getServerName()+":"+
  request.getServerPort()+path+"/";
%>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 
 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" 
 content="text/html; charset=ISO-8859-1">
<base href="<%=basePath%>">
<title>Edit employee details</title>
</head> 
<body>

 <f:view> 
  <h:form>

   <h:inputHidden id="id" value="#{Employee.empNo}"/>

  <h:panelGrid columns="2" border="0">

  <h:outputText value="Employee No :" />

 <h:inputText id="empNo" disabled="true"
  value="#{Employee.empNo}" required="true">
  <f:validateLongRange maximum="100000" minimum="1"/>					     
  </h:inputText>


  <h:outputText value="Employee Name :" />

  <h:inputText id="empName" 
   value="#{Employee.empName}" required="true">
    <f:validateLength maximum="100" minimum="2"/>						     
  </h:inputText>

  <h:outputText value="Department Name :" />

  <h:selectOneMenu id="deptName" value="#{Employee.deptName}" required="true">
   <f:selectItems value="#{Employee.deptOptions}" />
  </h:selectOneMenu>

  <h:outputText value="Sex :" />

  <h:selectOneRadio id="sex" value="#{Employee.sex}" required="true">
   <f:selectItem id="male" itemLabel="Male" itemValue="male" />
   <f:selectItem id="female" itemLabel="Female" itemValue="female" />
  </h:selectOneRadio>

  <h:outputText value="Salary :" />

  <h:inputText id="salary" 
    value="#{Employee.salary}" required="true">
    <f:validateDoubleRange minimum="1000.00" maximum="10000000.00"/>	
  </h:inputText>

   <h:outputText value="Employee Band :" />

  <h:selectOneListbox id="band" value="#{Employee.band}" 
     size="3" required="true">
   <f:selectItem id="bandA" itemLabel="Band A" itemValue="A" />
   <f:selectItem id="bandB" itemLabel="Band B" itemValue="B" />
   <f:selectItem id="bandC" itemLabel="Band C" itemValue="C" />
   <f:selectItem id="bandD" itemLabel="Band D" itemValue="D" />
   <f:selectItem id="bandE" itemLabel="Band E" itemValue="E" />
  <f:selectItem id="bandF" itemLabel="Band F" itemValue="F" />
  </h:selectOneListbox>


  </h:panelGrid>

  <h:messages id="errors" 
    style="color:red;font-weight:bold" 
   layout="table" />

   <h:commandButton value="Save" 
   action="saveEmployee" 
   actionListener="#{Employee.editEmployee}"  />


   </h:form>
  </f:view>
</body>
</html>

Similarly, create RetrieveEmployee.jsp and the contents are as follows.

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	RetrieveEmployee.jsp

<%@ page language="java" contentType="text/html; 
 charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ page language="java" %>

<%@ taglib uri="/WEB-INF/tld/myfaces-_html.tld"  prefix="h" %>
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld"  prefix="f" %>  

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+
request.getServerName()+":"+request.getServerPort()+path+"/";
%>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 
 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
  charset=ISO-8859-1">
<base href="<%=basePath%>">
<title>Add employee details</title>
</head> 
<body>

 <f:view> 
  <h:form>
   <h:panelGrid columns="2" border="0">

  <h:outputText value="Employee No :" />

 <h:inputText id="empNo" 
  value="#{Employee.empNo}">
  </h:inputText>

  </h:panelGrid>

<h:messages id="errors" 
style="color:red;font-weight:bold" 
layout="table" />

<h:commandButton value="Retrieve" 
action="retrieveEmployee" 
actionListener="#{Employee.retrieveEmployee}" />

<h:commandButton value="Cancel" 
action="cancel"/>


  </h:form>
 </f:view>
</body>
</html>

Open the geronimo-web.xml and replace the existing contents with the following contents. We explain the contents later when creating the datasource.

Code Block

	XML
	XML
borderStyle	solid
title	geronimo-web.xml

<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns="http://geronimo.apache.org/xml/ns/j2ee/web-2.0.1" 
 xmlns:naming="http://geronimo.apache.org/xml/ns/naming-1.2" 
  xmlns:sec="http://geronimo.apache.org/xml/ns/security-2.0" 
  xmlns:sys="http://geronimo.apache.org/xml/ns/deployment-1.2">
 
  <sys:environment>
   <sys:moduleId>
    <sys:groupId>EmployeeJSF</sys:groupId>
    <sys:artifactId>WEB</sys:artifactId>
    <sys:version>1.0</sys:version>
    <sys:type>car</sys:type>
  </sys:moduleId>

 <dependencies>
  <dependency>
   <groupId>console.dbpool</groupId>
   <artifactId>EmployeeDS</artifactId>
  </dependency>
 </dependencies>

 </sys:environment>

 <context-root>/EmployeeWEB</context-root>
</web-app>

...

Child pages

Versions Compared

Old Version 15

New Version 16

Key