Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin

...

  1. 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
    borderStylesolid
    titleindex.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>
    
  2. Similarly, create addEmployee.jsp and the contents are as follows.
    Code Block
    ActionScript
    ActionScript
    borderStylesolid
    titleaddEmployee.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>
    
  3. Similarly, create editEmployee.jsp and the contents are as follows.
    Code Block
    ActionScript
    ActionScript
    borderStylesolid
    titleeditEmployee.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>
    
  4. Similarly, create RetrieveEmployee.jsp and the contents are as follows.
    Code Block
    ActionScript
    ActionScript
    borderStylesolid
    titleRetrieveEmployee.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>
    
  5. 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
    borderStylesolid
    titlegeronimo-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><sys:dependencies>
      <dependency><sys:dependency>
       <groupId>console<sys:groupId>console.dbpool</sys:groupId>
       <artifactId>EmployeeDS<<sys:artifactId>EmployeeDS</sys:artifactId>
      </sys:dependency>
     </sys:dependencies>
    
     </sys:environment>
    
     <context-root>/EmployeeWEB</context-root>
    </web-app>
    

...

  1. Open a browser window and hit the URL http://localhost:8080/EmployeeWEB/Image Removed. This will bring up the below screen.

  2. Click on the Add employee details link to get the below screen to add employees into the database. Just click on the Save button without entering any values. The JSF complains with validation errors as below.

  3. Enter the values as given in the screen below and click on the Save button. This will take back to the main page.

  4. Click on the Edit employee details link to get the below screen. Enter Employee No value as 10 and click on the Retrieve button.

  5. This will bring up the details of the employee whose employee number is 10. We can edit the values as required and click on the Save button.