THIS IS A TEST INSTANCE. ALL YOUR CHANGES WILL BE LOST!!!!
...
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
|
12. Right click on the EmployeeWEB and navigate to New => Class and create Employee.java as given in the below screen shot. Click on the Finish button after providing the values.
13. The contents of the com.jpa.sample.Employee.java are as follows. This is the entity class used with JPA for persistence.
...
14. Similarly, create sample.jsf.Employee.java. The contents of the class are as follows. This is the managed bean used by JSF.
...
15. Right click on the EmployeeWEB project and create index.jsp as follows.
The contents of the index.jsp are as follows.
...
<?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>
|
12. Right click on the EmployeeWEB and navigate to New => Class and create Employee.java as given in the below screen shot. Click on the Finish button after providing the values.
13. The contents of the com.jpa.sample.Employee are as follows. This is the entity class used with JPA for persistence.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
package com.jpa.sample;
import javax.persistence.Entity;
import javax.persistence.Id;
import javax.persistence.Table;
@Entity
@Table(name = "EMPLOYEE")
public class Employee {
@Id
public int empNo;
public String empName;
public String deptName;
public String sex;
public double salary;
public String band;
public int getEmpNo() {
return empNo;
}
public void setEmpNo(int empNo) {
this.empNo = empNo;
}
public String getEmpName() {
return empName;
}
public void setEmpName(String empName) {
this.empName = empName;
}
public String getDeptName() {
return deptName;
}
public void setDeptName(String deptName) {
this.deptName = deptName;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public double getSalary() {
return salary;
}
public void setSalary(double salary) {
this.salary = salary;
}
public String getBand() {
return band;
}
public void setBand(String band) {
this.band = band;
}
}
|
14. Similarly, create sample.jsf.Employee. The contents of the class are as follows. This is the managed bean used by JSF.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
package sample.jsf;
import java.util.ArrayList;
import javax.faces.event.ActionEvent;
import javax.faces.model.SelectItem;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.persistence.EntityManager;
import javax.persistence.PersistenceContext;
import javax.transaction.UserTransaction;
public class Employee {
public int empNo;
public String empName;
public String deptName;
public String sex;
public double salary;
public String band;
ArrayList<SelectItem> deptOptions;
@PersistenceContext
private EntityManager em;
public Employee(){
deptOptions = new ArrayList<SelectItem>();
SelectItem option = new SelectItem("Inventory", "Inventory");
deptOptions.add(option);
option = new SelectItem("Production", "Production");
deptOptions.add(option);
option = new SelectItem("Accounts", "Accounts");
deptOptions.add(option);
option = new SelectItem("Finance", "Finance");
deptOptions.add(option);
option = new SelectItem("Marketing", "Marketing");
deptOptions.add(option);
option = new SelectItem("IncomeTax", "IncomeTax");
deptOptions.add(option);
option = new SelectItem("Engineering", "Engineering");
deptOptions.add(option);
}
public int getEmpNo() {
return empNo;
}
public void setEmpNo(int empNo) {
this.empNo = empNo;
}
public String getEmpName() {
return empName;
}
public void setEmpName(String empName) {
this.empName = empName;
}
public String getDeptName() {
return deptName;
}
public void setDeptName(String deptName) {
this.deptName = deptName;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public double getSalary() {
return salary;
}
public void setSalary(double salary) {
this.salary = salary;
}
public String getBand() {
return band;
}
public void setBand(String band) {
this.band = band;
}
public void addEmployee(ActionEvent event){
com.jpa.sample.Employee employeeDup =
em.find(com.jpa.sample.Employee.class, this.empNo);
if(employeeDup != null)
throw new IllegalArgumentException
("Message : sample.jsf.Employee :
Employee Already Exits ("+this.empNo+")");
com.jpa.sample.Employee employee =
new com.jpa.sample.Employee();
employee.setBand(this.band);
employee.setDeptName(this.deptName);
employee.setEmpName(this.empName);
employee.setEmpNo(this.empNo);
employee.setSalary(this.salary);
employee.setSex(this.sex);
try{
Context ctx = new InitialContext();
UserTransaction ut =
(UserTransaction)ctx.lookup("java:comp/UserTransaction");
ut.begin();
em.persist(employee);
ut.commit();
}catch (Exception e){
throw new IllegalArgumentException
("Message : sample.jsf.Employee : Exception :"+e);
}
}
public void editEmployee(ActionEvent event){
try{
Context ctx = new InitialContext();
UserTransaction ut = (UserTransaction)
ctx.lookup("java:comp/UserTransaction");
ut.begin();
com.jpa.sample.Employee employee =
em.find(com.jpa.sample.Employee.class, this.empNo);
employee.setBand(this.band);
employee.setDeptName(this.deptName);
employee.setEmpName(this.empName);
employee.setEmpNo(this.empNo);
employee.setSalary(this.salary);
employee.setSex(this.sex);
ut.commit();
}catch (Exception e){
throw new IllegalArgumentException
("Message : sample.jsf.Employee : Exception :"+e);
}
}
public ArrayList<SelectItem> getDeptOptions() {
return deptOptions;
}
public void setDeptOptions(ArrayList<SelectItem> deptOptions) {
this.deptOptions = deptOptions;
}
public void retrieveEmployee(ActionEvent event){
com.jpa.sample.Employee employeeDup =
em.find(com.jpa.sample.Employee.class, this.empNo);
if(employeeDup == null)
throw new IllegalArgumentException
("Message : sample.jsf.Employee : Employee does not exit ("+this.empNo+")");
this.setBand(employeeDup.getBand());
this.setDeptName(employeeDup.getDeptName());
this.setEmpName(employeeDup.getEmpName());
this.setEmpNo(employeeDup.getEmpNo());
this.setSalary(employeeDup.getSalary());
this.setSex(employeeDup.getSex());
}
}
|
15. Right click on the EmployeeWEB project and create index.jsp as follows.
The contents of the index.jsp are as follows.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
<!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>
|
16. Similarly, create addEmployee.jsp and the contents are as follows.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
<%@ 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>
|
17. Similarly, create editEmployee.jsp and the contents are as follows.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
<%@ 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>
|
18. Similarly, create RetrieveEmployee.jsp and the contents are as follows.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
<%@ 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>
|
19. 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 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>
|
20. Click on the faces-config.xml to open Faces Configuration Editor.
21. Click on the ManagedBean tab below and Click on the Add button.
This will open New Managed Bean Wizard.
22. Click on the browse button and search for sample.jsf.Employee class and click on the OK button.
23. Click on the Next button on the New Managed Bean Wizard. On the next screen, select Scope as request and click on the Next button.
24. Click on the Next button and finally, click on the Finish button. This will bring up the following screen shot as below.
25. Click on the Navigation Rule tab and move the mouse over Palette to bring it to the front.
26. Click on the Page and move the mouse over main area and click once. This will bring up Select JSP File wizard. Select the index.jsp and click on the OK button.
27. Similarly, add other JSPs also to the main area as follows.
28. Bring the Palette to the front and click on the Link.
- Place the mouse on
addEmployee.jspon the main area and click once and move it toindex.jspand click once.
- Similarly, click the mouse over
RetrieveEmployee.jspand move the mouse toindex.jspand click once.
- Click the mouse over
RtrieveEmployee.jspand move the mouse overeditEmployee.jspand click once.
- Click the mouse over
editEmployee.jsp}}and move the mouse over {{RetrieveEmployee.jspand click once.
The above actions create navigation rules and look like the screen shot below.
29. Press the escape button once and click on the link between addEmployee.jsp and index.jsp.
On the Properties window at the bottom, go the From Outcome textbox
and provide the value as saveEmployee.
30. Similarly, Click on the link between RetrieveEmployee.jsp and index.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as cancel.
32. Similarly, Click on the link between RetrieveEmployee.jsp and editEmployee.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as retrieveEmployee.
33. Similarly, Click on the link between editEmployee.jsp and RetrieveEmployee.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as saveEmployee.
34. Click on the Source button to view the XML content generated out of these navigations rules and configuration. The contents should be as follows.
| Code Block | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
<?xml version="1.0" encoding="UTF-8"?>
<faces-config
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-facesconfig_1_2.xsd"
version="1.2">
<navigation-rule>
<description>Add Employee</description>
<from-view-id>/addEmployee.jsp</from-view-id>
<navigation-case>
<from-outcome>saveEmployee</from-outcome>
<to-view-id>/index.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<navigation-rule>
<description>Retrieve Employee</description>
<from-view-id>/RetrieveEmployee.jsp</from-view-id>
<navigation-case>
<from-outcome>retrieveEmployee</from-outcome>
<to-view-id>/editEmployee.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<navigation-rule>
<description>Retrieve Employee</description>
<from-view-id>/RetrieveEmployee.jsp</from-view-id>
<navigation-case>
<from-outcome>cancel</from-outcome>
<to-view-id>/index.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<navigation-rule>
<description>Edit Employee</description>
<from-view-id>/editEmployee.jsp</from-view-id>
<navigation-case>
<from-outcome>saveEmployee</from-outcome>
<to-view-id>/RetrieveEmployee.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<managed-bean>
<description>
Employee Bean
</description>
<managed-bean-name>Employee</managed-bean-name>
<managed-bean-class>sample.jsf.Employee</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
|
16. Similarly, create addEmployee.jsp and the contents are as follows.
17. Similarly, create editEmployee.jsp and the contents are as follows.
18. Similarly, create RetrieveEmployee.jsp and the contents are as follows.
19. Open the geronimo-web.xml and replace the existing contents with the following contents. We explain the contents later when creating the datasource.
...
20. Click on the faces-config.xml to open Faces Configuration Editor.
21. Click on the ManagedBean tab below and Click on the Add button.
This will open New Managed Bean Wizard.
22. Click on the browse button and search for sample.jsf.Employee class and click on the OK button.
23. Click on the Next button on the New Managed Bean Wizard. On the next screen, select Scope as request and click on the Next button.
24. Click on the Next button and finally, click on the Finish button. This will bring up the following screen shot as below.
25. Click on the Navigation Rule tab and move the mouse over Palette to bring it to the front.
26. Click on the Page and move the mouse over main area and click once. This will bring up Select JSP File wizard. Select the index.jsp and click on the OK button.
27. Similarly, add other JSPs also to the main area as follows.
28. Bring the Palette to the front and click on the Link.
- Place the mouse on
addEmployee.jspon the main area and click once and move it toindex.jspand click once.
- Similarly, click the mouse over
RetrieveEmployee.jspand move the mouse toindex.jspand click once.
- Click the mouse over
RtrieveEmployee.jspand move the mouse overeditEmployee.jspand click once.
- Click the mouse over
editEmployee.jsp}}and move the mouse over {{RetrieveEmployee.jspand click once.
The above actions create navigation rules and look like the screen shot below.
29. Press the escape button once and click on the link between addEmployee.jsp and index.jsp.
On the Properties window at the bottom, go the From Outcome textbox
and provide the value as saveEmployee.
30. Similarly, Click on the link between RetrieveEmployee.jsp and index.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as cancel.
32. Similarly, Click on the link between RetrieveEmployee.jsp and editEmployee.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as retrieveEmployee.
33. Similarly, Click on the link between editEmployee.jsp and RetrieveEmployee.jsp, and on the Properties window at the bottom, go the From Outcome textbox and provide the value as saveEmployee.
34. Click on the Source button to view the XML content generated out of these navigations rules and configuration. The contents should be as follows.
| Code Block | |
|---|---|
| XML | XML |
| borderStyle | solid | title | faces-config.xml
35. This finishes the WEB application creation and JSF configuration. Export the EmployeeWEB to a EmployeeWEB.war file.
...