HTML and CSS Reference
In-Depth Information
figure 6-2
Proposed survey form
Required values are marked by an asterisk (*)
Share Your Experience at Red Ball Pizza
Date of visit
Customer Information
Name *
Street address
Receipt number *
Order type
Was the service friendly?
Postal code
Was the order correct?
Was the food hot?
Phone number
E-mail *
Overall food quality
Overall service quality
Where did you
hear about us?
General comments
How many times do you
dine out per month?
What's your favorite Red
Ball special dish?
The form is divided into two topical areas. The area on the left includes elements
requesting contact information from the customer, including the customer's name, phone
number, and e-mail address. The right side of the form contains questions regarding the
customer's treatment at Red Ball Pizza and his or her opinion of the food and service.
Parts of a Web Form
Each piece of information entered into a form is stored in a ield , and the data is known
as the field value . In some fields, users are free to enter anything they choose, while
other fields are limited to a set of allowed values. Users enter or select a field value using
control elements , which are buttons, boxes, lists, and so on, that provide a way of associ-
ating a field value with a particular field. HTML supports the following control elements:
input boxes for text and numerical entries
option buttons , also called radio buttons , for selecting a single option from a pre-
defined list
selection lists for long lists of options, usually appearing in a drop-down list box
check boxes for questions limited to true/false or yes/no responses
text areas for extended entries that can include several lines of text
HTML5 introduced the following control elements:
color pickers to choose colors from an array of color values
calendar pickers to select dates and times from a calendar or clock
spin boxes for specifying numeric values from sets of numbers
sliders for selecting numeric values from ranges of possible values
At the time of this writing, these HTML5 control elements are not supported by all
current browsers; you'll explore browser support in more detail later in this tutorial.
Alice's proposed survey form includes several examples of these different control ele-
ments, each one associated with a particular field. Note that some fields in the survey
form are required fields , meaning that before the form data can be submitted, users must
enter values for those fields. Alice's survey form includes required fields for recording the
Search WWH ::

Custom Search