< Previous | Next >

 

Lesson 7: Add elements to JSPs

Use this lesson to learn how to add input fields, push buttons, and output fields to JSP pages to create dynamic user interfaces for input and output.

In the input fields, the user of the resulting application will type the day, month, and year of interest. The input page includes Submit and Refresh buttons. In the output field, the corresponding day of the week will be displayed. To create these pages:

  1. Add elements to the input JSP page.

  2. Add elements to the output JSP page.

 

Input page

To add fields and push buttons to the input JSP page:

  1. In your Web diagram, double-click the input.jsp page to open the page in the editor.

  2. In the editor, click the Design tab.

  3. In the main menu bar, select

    Window | Show View | Other.

  4. In the window, select

    Web | Page Data and click OK to open the Page Data view.

  5. In the Page Data view, expand the

    Struts Form Beans folder. Find the dateData form bean and the fields that you defined.

  6. Drag

    dateData from the Page Data view onto the input JSP page in the editor. The

    Insert Data Object dialog opens.

  7. Clear dayofWeek

  8. Select

    Updating an existing record.

  9. Click

    Options, and ensure that the

    Submit button and

    Delete button check boxes are selected. Then click OK.

  10. Click Finish to create the fields and buttons in the form.

  11. Save and close the input JSP file.

 

Output page

To add fields to the output JSP page:

  1. In your Web diagram, double-click the output.jsp page to open the page in the editor.

  2. In the editor, click the Design tab.

  3. In the Page Data view, expand the

    Struts Form Beans folder. Drag

    dateData from the Page Data view onto the input JSP page in the editor. The

    Insert Data Object dialog opens.

  4. Clear

    year,

    month, and

    day

  5. Select

    Displaying an existing record and click Finish to create the fields in the page.

  6. Save and close the output JSP file.

 

Lesson checkpoint

In this lesson, you added input fields and push buttons to the input JSP page. You also added output fields to the output JSP page.

You learned to do these tasks:

< Previous | Next >