HTML and CSS Reference
In-Depth Information
Web Page Forms
The Blu Wav Music Web page form shown in Figure 6-1b on page HTML 285 shows an
example of a dynamic Web page form designed to request specific information from the
Web page visitor. A Web page form has three main components:
Input controls
•
A <form> tag, which contains the information necessary to process the form
•
A Submit button, which sends the data to be processed
•
Input Controls
An
input control
is any type of input mechanism on a form. A form may contain
several different input controls classified as data or text input controls. Most controls are
defined in an HTML form by using the type attribute of the <input /> tag. A
data input
control
can be a radio button (radio), a check box (checkbox), a Submit button (submit),
a Reset button (reset), or a selection menu (select). A
text input control
allows the user
to enter text through the following:
A
Forms
Several HTML guides on
the Internet discuss the use
of forms on Web pages.
Many of these sites are
created and maintained
at universities. The guides
give practical tips on the
purpose and use of HTML
tags and attributes. To
view an HTML guide, use a
search engine to search for
the phrase “HTML form
guide” or a related phrase.
•
text box
(text), for small amounts of text
A
•
textarea box
(textarea), for larger amounts of text
A
•
password text box
(password), for entering a password
As shown in Figure 6-1b, the form developed in this chapter uses several different
data and text input controls.
Of the available input controls, the eight listed in Table 6-1 are used most often in
form creation.
Table 6-1 Form Input Controls
Control
Function
Remarks
text
• Creates a single-line field for a relatively
small amount of text
• Indicates both the size of the field and the
total maximum length
password
• Identical to text boxes used for single-
line data entry
• Echoes (or masks) the entered text as bullets
textarea
• Creates a multiple-line field for a
relatively large amount of text
• Indicates the number of rows and columns for
the area
select
• Creates a drop-down menu of choices
from which a visitor can select an option
or options
• Indicates the length of the list in number
of rows
checkbox
• Creates a single item or a list of items
• Indicates a single item that can be checked
• Indicates a list of more than one item that can
be chosen
radio
• Creates a list item
• Indicates only one item in a list can be chosen
submit
• Submits a form for processing
• Tells the browser to send the data on the form
to the server
reset
• Resets the form
• Returns all input controls to the default status
A
text control
creates a text box that is used for a single line of input (Figure 6-2
on the next page). The text control has two attributes:
size
•
, which determines the number of characters that are displayed on the form
maxlength
•
, which specifies the maximum length of the input field
