• This tutorial uses the source code of the ConsultingAgency application. If you have not completed the tutorial Generating a JavaServer Faces CRUD Application from a Database where you create the ConsultingAgency application, you may want to do that now. Alternatively, you can download the project that is used as the starting point for this series as a .zip archive or get the project sources from Kenai.
• This project uses some experimental JSF libraries to add Ajax functionality described in the third tutorial in the series. The JSF libraries are bundled with NetBeans IDE 6.5. If you are using NetBeans IDE 6.7, you will need to install the JSF Extensions (Ajax) plugin from the NetBeans Beta Update Center. Alternatively, you can remove the source code that implements the Ajax functionality and skip the third document in the series. For details, see the section on Removing Ajax Functionality. For more about the functionality provided by the plugin, see the section Enabling Ajax in the Application in the Generating a JavaServer Faces CRUD Application from a Database tutorial.

Description of Project Requirements

The following project description and requirements can be seen as an example of what might be expected when developing a project.

Create pages that enable consultants to login and search for their billable items. Consultants should be able to edit their billable items and create new billable items that they assign to a project. Consultants can also delete a billable item.

When creating or editing a billable item, a consultant can modify the following fields:

• Start and end dates
• Number of billable hours
• Description of billable item
• Associated project

Consultants are not allowed to do the following:

• Edit their hourly rate
• Create a new project
• View or edit data associated with other consultants
• Access pages not related to their billable items

Based on the project requirements, you can begin to assemble a list of changes that you will need to make to the generated code.

Required Changes

To meet the project requirements, you will need to modify part of the ConsultingAgency application to optimize the web interface for users that are registered as consultants and enable them to view and work with their billable items.

After analyzing the project requirements you can assemble a list of the changes you need to make to the application.

• Create a Login page to authenticate the consultants
• Create a Welcome page for the logged in consultant with links to pages to search billable items, create a new billable item and to logout.
• Create a Search Billable Items page that enables the consultant to search for their billable items using the following criteria.
  • item ID
  • earliest possible start date
  • latest possible end date
  • number of hours worked
  • hourly rate
  • description of the work
  • project name
• Create a page to display search results. Only those items for which the consultant has an existing billable item are displayed in the results.
• Create pages to display details of a billable item, to edit billable items and to create new billable items.

  These pages include fields for the start date, end date, number of hours worked, hourly rate, description of the work, artifacts as text, and the project. The pages also displays a read-only field with the item ID.

• Add data validation to the text fields for start date, end date, number of hours and the project drop-down list.
• Add links to pages available to the logged in consultant (and remove links to other pages)
• Add logout link to all pages

In a real world application there would be many more required changes, but for this tutorial you will only concentrate on implementing functionality associated with consultants and their billable items.

• When you open the project, you might see a warning about a missing project resource if the JSF Extensions (Ajax) plugin is not installed. You need to install the plugin to add the JSF libraries required by the project. Alternatively, you can remove the requirement for the plugin by following the steps in the section Removing Ajax Functionality. For more about the functionality provided by the plugin, see the section Enabling Ajax in the Application in the Generating a JavaServer Faces CRUD Application from a Database tutorial.
• When you open the project, you might see a warning about a missing server. To resolve the problem, right-click the project node in the Project window, choose Resolve Missing Server Problem and then specify your local GlassFish v2.x server instance in the dialog box.
• If you use the zip archive or get the sources from Kenai, you need to use the MySQL database server and create and populate the consult database as described in the Generating a JavaServer Faces CRUD Application from a Database tutorial.

Getting Project Sources from Kenai

If you are using NetBeans IDE 6.7, you can get the sources from the remote repository and open the project in the IDE. You can find the sources in the repository of the Consulting Agency Solution Project. The repository contains the project sources for each of the tutorials in this series.

To get the sources for this tutorial from the repository on Kenai, perform the following steps.

1. Choose Team > Kenai > Get Sources from Kenai from the main menu.

   Alternatively, you can choose Open Kenai Project to add the project to the Kenai dashboard and then get the project sources.

2. In the Get Sources from Kenai dialog box, locate the Kenai Repository by clicking Browse to open the Browse Kenai Projects dialog box.
3. Search for the Consulting Agency Solution Project.
4. Select the Consulting Agency Solution Project and click OK.
5. Click Browse to specify the Folder to Get and select base1. Click OK.
   
6. Click Browse to specify the Local Folder for the sources (the local folder must be empty).
7. Click Get From Kenai.

   When you click Get From Kenai, the IDE initializes the local folder as a Subversion repository and checks out the project sources.

8. Click Open Project in the dialog that appears when checkout is complete.

For more information about getting sources from Kenai, see Opening a Kenai Project.

Troubleshooting

If you are running the project for the first time, you might encounter the following problems displayed in the Output window.

• javax.naming.NameNotFoundException: consult not found. This exception usually indicates that the data source consult is not registered with the application server. To resolve the problem, you probably will need to create a connection pool and JDBC resource for the consult database. You can create the connection pool and JDBC resource for the database in the IDE using the New File wizard.

  You can also create the connection pool and JDBC resource directly on the server using the GlassFish Admin Console.

  To create the connection pool for the consult database using the New File wizard, perform the following steps.

  1. In the Services window, create and open a connection to the consult database.
  2. In the Projects window, right-click the project node and choose New > Other to open the New File wizard.
  3. Select JDBC Connection Pool in the GlassFish category.
  4. Provide a name for the connection pool, for example consult.
  5. Select the consult database from the Existing Connection drop down list. Click Next.
  6. Check the connection details in the last panel. Click Finish

  After you create the connection pool, use the New File wizard to create a JDBC Resource named jdbc/consult.

  To create the jdbc/consult JDBC resource for the consult database using the New File wizard, perform the following steps.

  1. In the Projects window, right-click the project node and choose New > Other to open the New File wizard.
  2. Select JDBC Resource in the GlassFish category.
  3. Select the JDBC connection pool for the consult database from the drop down list of existing connection pools.
  4. Type jdbc/consult for the JNDI name of the resource. Click Finish.

  The IDE will create the sun-resources.xml file that specifies the resource details. The JDBC resource will be created when you run the application.

• build-impl.xml:526: Warning: Could not find file ... /ConsultingAgency/${libs.jsf-extensions.classpath} to copy. BUILD FAILED (total time: 0 seconds) If the project fails to build with this error it probably means that the jsf-extensions (Ajax) library is not available. To resolve the problem, you can do either of the following:
  • Remove the jsf-extensions library from the list of compile-time libraries in the project's Properties window. For details, see the section on Removing Ajax Functionality.
  • Install the JSF Extensions (Ajax) plugin from the Beta Update Center by choosing Tools > Plugins and installing the plugin using the Plugins manager.

Creating a Login Page

In this exercise you create a login page by duplicating the Edit.jsp page and then modifying the code so that the page only displays text fields for a user name (email) and password. The login.jsp page that you create in this exercise needs to be in the root level of the Web Pages directory.

1. Expand the Web Pages > consultant node in the Projects window.
2. Right-click Edit.jsp and choose Copy.
3. Right-click the Web Pages node and choose Paste.
4. Rename the copy to login.jsp.
5. Double-click login.jsp to open the file in the editor.
6. Modify the <title> and <h1> elements to change Editing Consultant to Consultant Timecard Application – Login.
7. Modify the form to remove the unneccessary lines. The login page only needs input text fields for the email and password and one text link. The form should look like the following.

   <h:form>
       <h:panelGrid columns="2">
           <h:outputText value="Email:"/>
           <h:inputText id="email" value="#{consultant.consultant.email}" title="Email" required="true" requiredMessage="The email field is required." />
           <h:outputText value="Password:"/>
           <h:inputText id="password" value="#{consultant.consultant.password}" title="Password" required="true" requiredMessage="The password field is required." />
       </h:panelGrid>
       <br />
       <h:commandLink action="#{consultant.edit}" value="Save">
   </h:commandLink>
   </h:form>

8. Make the following changes (in bold) to make the text field for the password hide the characters.

   <h:inputSecret id="password" value="#{consultant.consultant.password}" title="Password" required="true" requiredMessage="The password field is required." />

9. Make the following changes (in bold) to modify the commandLink action to access the login method and to change the link text from Save to Login. You will add the login method to ConsultantController.java later when you modify the Java classes.

       <h:commandLink action="#{consultant.login}" value="Login" />
   </h:form>

   Note. Be sure to remove the closing </h:commandLink> tag and add the closing slash after the "Login" value.

10. Save your changes.

Creating the Consultant Welcome Page

The welcomeJSF.jsp page is displayed after a consultant logs in and contains links to the pages that the consultant can access. In this exercise you will modify welcomeJSF.jsp to remove the links generated by the IDE and add links to a Search page and a New Billable page. You will also add an element for displaying error messages and a link to log out.

1. Double-click welcomeJSF.jsp under the Web Pages node to open the file in the editor.
2. Modify the <title> tag to Consultant Timecard Application.
3. Add an error message panel by adding the following code (in bold) below the <body> tag:

   <body>
       <h:panelGroup id="messagePanel" layout="block">
           <h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/>
       </h:panelGroup>
   <h:form>

4. Remove the unneccessary links and modify the form to look like the following:

   <h:form>
       <h1><h:outputText value="Consultant Timecard Application" /></h1>
       <h:commandLink action="#{billable.searchSetup}" value="Search Billable Items"/>
       <br />
       <h:commandLink action="#{billable.createSetup}" value="New Billable"/>
       <br />
       <h:commandLink action="#{consultant.logout}" value="Logout"/>
   </h:form>

   You will create the searchSetup, createSetup and logout methods later when you modify the Java classes.

5. Save your changes.

Creating the Search Page

In this exercise you will create a search page in the billable directory by copying an existing file and then making the following modifications to modify the search criteria.

• Modify the date format to remove the requirement for hours, minutes and seconds
• Modify the Hours and Hourly Rate inputText elements. You will change the value of the hourlyRate to point to a different method in the controller class for billable. You will add the new method later.
• Remove unnecessary form elements for fields that will not be used as search criteria
• Modify the select menu item so that only projects for the logged in consultant are displayed

After you modify the search criteria fields, you will modify the page links to remove unneccessary links and call the search method.

1. Expand the Web Pages > billable node in the Projects window.
2. Create a page named Search.jsp by copying Edit.jsp. Open Search.jsp in the editor.
3. Modify the <title> and <h1> elements to change Editing Billable to Search Billable Items.
4. Make the following changes (in bold) to add an id to the form element.

   <h:form id="form1">
      <h:panelGrid columns="2">

5. Make the following changes to billableId to change outputText to inputText and add a converter message.

   <h:outputText value="BillableId:"/>
   <h:inputText value="#{billable.billable.billableId}" title="BillableId" converterMessage="The billable id field must be an integer." />

6. Make the following changes (in bold) to the text fields for the startDate and endDate to modify the date formats (to remove the hours, minutes and seconds) and to add converter messages. You also add a validator for the endDate (you will create the validator method later when you edit the Java classes).

   <h:outputText value="Earliest Possible StartDate (MM/dd/yyyy):"/>
   <h:inputText id="startDate" value="#{billable.billable.startDate}" title="StartDate" converterMessage="Invalid start date.">
       <f:convertDateTime pattern="MM/dd/yyyy" />
   </h:inputText>
   <h:outputText value="Latest Possible EndDate (MM/dd/yyyy):"/>
   <h:inputText id="endDate" value="#{billable.billable.endDate}" title="EndDate" validator="#{billable.validateEndDate}" converterMessage="Invalid end date.">
       <f:convertDateTime pattern="MM/dd/yyyy" />
   </h:inputText>

7. Make the following changes to hours and hourlyRate to replace the required="true" and the requiredMessage with a converter message. You also change the value of the input for hours to access searchHours (you will create the method later).

   <h:outputText value="Hours:"/>
   <h:inputText id="hours" value="#{billable.searchHours}" title="Hours" converterMessage="The hours field must be an integer." />
   <h:outputText value="HourlyRate:"/>
   <h:inputText id="hourlyRate" value="#{billable.billable.hourlyRate}" title="HourlyRate" converterMessage="The hourly rate field must be monetary figure." />

8. Remove the Billable Hourly Rate as a search criterion by removing the following lines for billableHourlyRate:

   <h:outputText value="BillableHourlyRate:"/>
   <h:inputText id="billableHourlyRate" value="#{billable.billable.billableHourlyRate}" title="BillableHourlyRate" required="true" requiredMessage="The billableHourlyRate field is required." />

9. Remove Artifacts and ConsultantId as search criteria by removing the following lines for artifacts and consultantId:

   <h:outputText value="Artifacts:"/>
   <h:inputTextarea rows="4" cols="30" id="artifacts" value="#{billable.billable.artifacts}" title="Artifacts" />
   <h:outputText value="ConsultantId:"/>
   <h:selectOneMenu id="consultantId" value="#{billable.billable.consultantId}" title="ConsultantId" required="true" requiredMessage="The consultantId field is required." >
       <f:selectItems value="#{consultant.consultantItemsAvailableSelectOne}"/>
   </h:selectOneMenu>

10. Modify the project menu items to remove the required="true" and requiredMessage properties of the selectOneMenu element and to modify the value (in bold) of the selectItems element to display projects for the logged in consultant (you will create the method later when you edit the Java classes).

    <h:outputText value="Project:"/>
    <h:selectOneMenu id="project" value="#{billable.billable.project}" title="Project">
        <f:selectItems value="#{project.billedProjectsForLoggedInConsultantSelectOne}"/>
    </h:selectOneMenu>

11. Remove the links to Save, Show and Show All Billable Items and add the following link (in bold) to the Search method (you will add the search method to BillableController.java later).

       </h:panelGrid>
        <h:commandLink action="#{billable.search}" value="Search"/>
        <br />
        <h:commandLink value="Index" action="welcome" immediate="true" />
    </h:form>

12. Save your changes.

You will now create a page to display search results by modifying the List.jsp page.

Creating the Search Results Page

When consultants run a search for their billable items, the results of the search are displayed in List.jsp. You will now modify the search results page to remove fields that will not be displayed. You will also add a parameter to the destroy action and add a link to enable the consultant to modify the search criteria.

1. Expand the Web Pages > billable > node and open Web Pages > billable > List.jsp in the editor.
2. Modify the <title> and <h1> elements to change Listing Billable Items to Billable Results.
3. Modify the convertDateTime pattern for item.startDate and item.endDate to remove the pattern for hours, minutes and seconds (hh.mm.ss).
4. Remove the BillableHourlyRate and ConsultantId columns.
5. Modify the billable.destroy action by adding the following parameter (in bold).

   <h:commandLink value="Destroy" action="#{billable.destroy}">
         <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][item][billable.converter].jsfcrud_invoke}"/>
         <f:param name="jsfcrud.timecard.consultantOfCurrentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][item.consultantId][consultant.converter].jsfcrud_invoke}"/>
         </h:commandLink>

6. Add the following commandLink action (in bold).

   <h:commandLink action="#{billable.searchSetup}" value="Modify Criteria"/>
      <br />
   <h:commandLink action="#{billable.createSetup}" value="New Billable"/>
   <br />
   <h:commandLink value="Index" action="welcome" immediate="true" />

7. Save your changes.

Modifying the New Billable and Editing Billable Pages

You now need to modify the pages for creating (New.jsp) and editing (Edit.jsp) billable items. You will make the following changes to each of the generated pages.

• Remove the time pattern for the start date and end date
• Add converter messages for start date, end date and hours
• Add a validator for the end date
• Remove the requirement=true and reguiredMessage for the hourly rate
• Remove the billableHourlyRate and consultantId elements
• Modify the selectItems value for the project so that only projects associated with the consultant are listed in the menu.
• Modify a link to perform a new search

The fields needed for creating a new billable item and editing an existing item are the same, so you will make the same changes to each of the pages.

1. Expand the Web Pages > billable > node and open New.jsp in the editor.
2. Add id="form1" to the <h:form> tag.
3. Make the following changes (in bold) to startDate and endDate to remove the HH:mm:ss date pattern and add the appropriate validator and converter messages.

   <h:outputText value="StartDate (MM/dd/yyyy):"/>
   <h:inputText id="startDate" value="#{billable.billable.startDate}" title="StartDate" converterMessage="Invalid start date.">
   <f:convertDateTime pattern="MM/dd/yyyy" />
   </h:inputText>
   
   <h:outputText value="EndDate (MM/dd/yyyy):"/>
   <h:inputText id="endDate" value="#{billable.billable.endDate}" title="EndDate" validator="#{billable.validateEndDate}" converterMessage="Invalid end date.">
   <f:convertDateTime pattern="MM/dd/yyyy" />
   </h:inputText>

4. Modify hours to add a converter message.

   <h:inputText id="hours" value="#{billable.billable.hours}" title="Hours" required="true" requiredMessage="The hours field is required." converterMessage="The hours field must be an integer." />

5. Modify the hourlyRate to change inputText to outputText and remove the reguirement="true" and the requiredMessage.

   <h:outputText value="#{billable.billable.hourlyRate}" title="HourlyRate" />

6. Remove the following lines to remove the billableHourlyRate and consultantId elements.

   <h:outputText value="BillableHourlyRate:"/>
   <h:inputText id="billableHourlyRate" value="#{billable.billable.billableHourlyRate}" title="BillableHourlyRate" required="true" requiredMessage="The billableHourlyRate field is required." />

   <h:outputText value="ConsultantId:"/>
   <h:selectOneMenu id="consultantId" value="#{billable.billable.consultantId}" title="ConsultantId" required="true" requiredMessage="The consultantId field is required." >
     <f:selectItems value="#{consultant.consultantItemsAvailableSelectOne}"/>
   </h:selectOneMenu>

7. Modify the selectItems value for project so that the menu only lists the projects associated with the consultant.

   <h:selectOneMenu id="project" value="#{billable.billable.project}" title="Project" required="true" requiredMessage="The project field is required." >
       <f:selectItems value="#{project.assignedProjectsForLoggedInConsultantSelectOne}"/>
   </h:selectOneMenu>

8. Modify the commandLink item to link to a new search by changing the link from billable.listSetup to billable.searchSetup. You will create the searchSetup method later.

   <h:commandLink action="#{billable.searchSetup}" value="Search Billable Items" immediate="true"/>.

9. Save your changes.
10. Open Edit.jsp and make the same changes.

Modifying the Billable Details Page

The details page displays the details of a billable item in read-only format. You need to modify the page to make the item details consistent wiht the other pages by removing the time pattern and the generated code for elements that the consultant cannot edit. You will also modify a link to perform a new search.

1. Open Web Pages > billable > Detail.jsp in the editor.
2. Modify the convertDateTime pattern for startDate and endDate to remove the pattern for hours, minutes and seconds (hh.mm.ss).
3. Remove the following BillableHourlyRate items:

   <h:outputText value="BillableHourlyRate:"/>
   <h:outputText value="#{billable.billable.billableHourlyRate}" title="BillableHourlyRate" />
   

4. Replace the following lines:

   <h:panelGroup>
       <h:outputText value=" #{billable.billable.project}"/>
       <h:panelGroup rendered="#{billable.billable.project != null}">
           <h:outputText value=" ("/>
           <h:commandLink value="Show" action="#{project.detailSetup}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentProject" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.project][project.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLink>
           <h:outputText value=" "/>
           <h:commandLink value="Edit" action="#{project.editSetup}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentProject" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.project][project.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLink>
           <h:outputText value=" "/>
           <h:commandLink value="Destroy" action="#{project.destroy}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentProject" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.project][project.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLink>
           <h:outputText value=" )"/>
       </h:panelGroup>
   </h:panelGroup>
   <h:outputText value="ConsultantId:"/>
   <h:panelGroup>
       <h:outputText value=" #{billable.billable.consultantId}"/>
       <h:panelGroup rendered="#{billable.billable.consultantId != null}">
           <h:outputText value=" ("/>
           <h:commandLink value="Show" action="#{consultant.detailSetup}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentConsultant" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.consultantId][consultant.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLink>
           <h:outputText value=" "/>
           <h:commandLink value="Edit" action="#{consultant.editSetup}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentConsultant" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.consultantId][consultant.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLinkv
           <h:outputText value=" "/>
           <h:commandLink value="Destroy" action="#{consultant.destroy}">
               <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.currentConsultant" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.consultantId][consultant.converter].jsfcrud_invoke}"/>
               <f:param name="jsfcrud.relatedController" value="billable"/>
               <f:param name="jsfcrud.relatedControllerType" value="jsf.BillableController"/>
           </h:commandLink>
           <h:outputText value=" )"/>
       </h:panelGroup>
   </h:panelGroup>
         

   with the following line:

   <h:outputText value="#{billable.billable.project}"/>

5. Add the following parameter for the Destroy action:

   <h:commandLink action="#{billable.destroy}" value="Destroy">
         <f:param name="jsfcrud.currentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable][billable.converter].jsfcrud_invoke}" />
         <f:param name="jsfcrud.timecard.consultantOfCurrentBillable" value="#{jsfcrud_class['jsf.util.JsfUtil'].jsfcrud_method['getAsConvertedString'][billable.billable.consultantId][consultant.converter].jsfcrud_invoke}"/>
         </h:commandLink>

6. Modify the commandLink item to link to a new search by changing the link from billable.listSetup to billable.searchSetup. You will create the searchSetup method later.

   <h:commandLink action="#{billable.searchSetup}" value="Search Billable Items"/>

7. Save your changes.

You are now finished modifying the JSP pages. When editing the pages you added calls to several new methods that you now need to add to your Java classes. You can now go to the next section where you will modify the Java classes to incorporate the methods and add some navigation rules to faces-config.xml.

Go to Modifying the Generated JavaServer Faces CRUD Application - Java Classes