Creating a JSP Page to Enter New Data

In these steps, you create the insert.jsp page, which enables users to enter details of a new employee record.

  1. Create a new JSP page and call it insert.jsp.
  2. Give the page the same heading as before, AnyCo Corporation: HR Application, and format it as Heading 2, and center it.
  3. On the next line enter Insert Employee Record, and apply the Heading 3 format. Align this heading to the left of the page.
  4. Add the JDeveloper stylesheet to the page.
  5. Add a Form. In the Insert Form dialog box, enter insert_action.jsp for the Action property, and click OK.
  6. Add a Table inside the Form. Specify that you want 6 rows and 2 columns and accept all other layout defaults.
  7. In the first column, enter the following headings, each on a separate row: First Name, Last Name, Email, Phone, Job, Monthly Salary.
  8. Drag and drop a Text Field into the column to the right of the First Name header. In the Insert Field dialog box, type first_name in the Name property.
  9. Drag a Text Field next to each of the Last Name, Email, Phone, and Monthly Salary headers. Specify the values for each of these text fields for the Name property in the Insert Field dialog box. The values are indicated in the following table:
    Text Field For Set the Name Property To

    Last Name

    last_name

    Email

    email

    Phone

    phone_number

    Monthly Salary

    salary

    This procedure is different for the Job row.

  10. Drag a Combo Box component from the HTML Forms page of the Component Palette to the column next to the Job heading.
  11. In the Insert Select dialog box, enter job_id as the name, and 1 as the size. Click the add (+) icon and enter SA_REP in the Value field, and in the Caption field, enter Sales Representative. Click the add(+) sign to add each of the following job titles, then click OK.
    Value Caption

    HR_REP

    HR Representative

    PR_REP

    PR Representative

    MK_MAN

    Marketing Manager

    SA_MAN

    Sales Manager

    FI_MAN

    Finance Manager

    IT_PROG

    Software Developer

    AD_VIP

    Vice President
  12. Drag a Submit button to the Form below the table. In the Insert Submit Button dialog box, enter Add Employee for the Value property.
  13. Save your work.

Figure 5-6 shows the insert.jsp page in the Visual Editor.

Figure 5-6 Form to Insert Employee Data

Description of Figure 5-6 follows
Description of "Figure 5-6 Form to Insert Employee Data"