Creating the Login Interface

In these steps, you add fields to the login.jsp page on which users enter their login details.

  1. If the login.jsp page is not open in the Visual Editor, double-click it in the Application Navigator to open it, and check that the Design tab is selected.
  2. Position the cursor after the second scriptlet and select Form in the HTML Forms page of the Component Palette. In the Insert Form dialog box, enter login_action.jsp as the value for the Action field. This file will be used to process the user input in the login.jsp file. (You cannot select this page from a list as it is not created yet.) Leave the other fields empty and click OK.

    The Form is displayed on the page in the Visual Editor, represented by a dotted rectangle.

  3. Add a Table to the page. Position it inside the Form. Specify a 3-row and 2-column layout, and accept other layout defaults.
  4. In the first column of the three rows, enter the following as the text to display for users:

    User ID:

    Password:

    Host:

  5. From the HTML page of the Component Palette, drag a Text Field into the table cell to the right of the User ID: cell. In the Insert Text Field dialog box, enter userid as the value of the Name property. Leave the other fields empty and click OK.
  6. In the same way, add a Text Field to the table cell to the right of the Password: cell and enter password as the value of the Name property. Similarly, add a Text Field to the table cell to the right of the Host: cell and enter host as the value of the Name property.
  7. Drag a Submit button to the Form below the table. Enter Submit for the Value property of the button.

Your login.jsp page should now appear as shown in Figure 4-17.

Figure 4-17 Login Page

Description of Figure 4-17 follows
Description of "Figure 4-17 Login Page"