Recognize the HTML code that is used to create forms.
HTML Form Creation and Review
Most of the uses for servlets require information from the user: What’s your name? How many of those would you like to order?
There are several ways to gather information from a user on the Web, but a tried and true way is the HTML form. In this lesson we will review the tags used in a form to be sure you are comfortable and familiar with them.
HTML form tags
The HTML file below describes elements of the form to be submitted.
Standard beginning to an HTML page
Identifies the start of the form. A servlet will process this form drawing from the METHOD and ACTION attributes
A text input. User’s input is echoed on screen
A password input. User’s input is echoed as stars, but sent to server unencrypted
A checkbox input. Notice how the prompt is outside the tag
A checkbox input that is checked by default
A radio button. Radio buttons with the same name are part of a group and only one can be checked at once.
A radio button that is checked by default
Another radio button
This tag indicates the start of a table -- I put the two SELECT tags into table columns (indicated by the <td> tag) so they would fit better on a monitor.
A SELECT tag will appear as a drop-down box in the browser
Any number of OPTION tags can be in a SELECT
Do not forget to end your SELECT tag
Moving to the other column in the table
Use plain text to prompt the user
A SELECT tag with the MULTIPLE attribute will appear as a list box. Windows users can select multiple entries by holding CTRL as they click
OPTION tags are identical in SELECT and SELECT MULTIPLE
Do not forget to end your SELECT tag
This marks the end of the table
Another user prompt
Users can enter multiple lines in a TEXTAREA
Do not forget to end your TEXTAREA tag
This break tag helps format the page -- any kind of HTML is OK within form tags
A submit input is a button that will submit the form to the ACTION named in the FORM tag
A reset input is a button that will put all the values back to their defaults
Forms start with a <FORM> tag and end with a </FORM> tag.
Between the form tags are <INPUT>, <SELECT>, and <TEXTAREA> tags which are specific to an HTML form,
along with more general formatting and structural HTML tags like
<BR> or <TABLE>. There are six important types of INPUT tags, and two types of SELECT tags.
I loaded this HTML into my browser and typed in some of the fields. Here’s how it looked:
Form output
In the next lesson, I will discuss the structure of a servlet that uses form fields.