Chapter 9. Forms
Contents:
Form Fundamentals
The <form> Tag
A Simple Form Example
Using Email to Collect Form Data
The <input> Tag
The <button> Tag
Multiline Text Areas
Multiple Choice Elements
General Form Control Attributes
Labeling and Grouping Form Elements
Creating Effective Forms
Forms Programming
Forms, forms, forms, forms: we fill 'em out for nearly everything, from the moment we're born, 'til the moment we die. Pretty mundane, really. So what's to explain all the hoopla and excitement over forms? Simply this: they make HTML and, of course, XHTML truly interactive.
When you think about it, interacting with a web page is basically a lot of button pushing: click here, click there, go here, go there -- there's no real user feedback, and it's certainly not personalized. Applets provide extensive user-interaction capability, but they can be difficult to write and are still not standardized for all browsers. Forms, on the other hand, are supported by almost every browser and make it possible to create documents that collect and process user input and to formulate personalized replies.
This powerful mechanism has far-reaching implications, particularly for electronic commerce. It finishes an online catalog by giving buyers a way to immediately order products and services. It gives nonprofit organizations a way to sign up new members. It lets market researchers collect user data. It gives you an automated way to interact with your readers.
Mull over the ways you might want to interact with your readers while we take a look at both the client- and server-side details of creating forms.
9.1. Form Fundamentals
Forms are comprised of one or more text input boxes, clickable buttons, multiple-choice checkboxes, and even pull-down menus and image maps, all placed inside the <form> tag. You can have more than one form in a document, and within each you may also put regular body content, including text and images. The text is particularly useful for providing instructions to the users on how to fill out the form and for form element labels and prompts. And, within the various form elements, you can use JavaScript event handlers for a variety of effects like testing and verifying form contents and calculating a running sum.
A user fills out the various fields in the form, then clicks a special "Submit" button (or, sometimes, presses the Enter or Return key) to submit the form to a server. The browser packages up the user-supplied values and choices and sends them to a server or to an email address.[56] The server passes the information along to a supporting program or application that processes the information and creates a reply, usually in HTML. The reply may be simply a thank you or it might prompt the user on how to fill out the form correctly or to supply missing fields. The server sends the reply to the browser client, which then presents it to the user. With emailed forms, the information is simply put into someone's mailbox; there is no notification of the form being sent.
[56]Some browsers, Netscape and Internet Explorer in particular, may also encrypt the information, securing it from credit-card thieves, for example. However, the encryption facility must also be supported on the server-side as well: contact the web server manufacturer for details.
The server-side, data-processing aspects of forms are not part of the HTML or XHTML standards; they are defined by the server's software. While a complete discussion of server-side forms programming is beyond the scope of this book, we'd be remiss if we did not include at least a simple example to get you started. To that purpose, we've included at the end of this chapter a few skeletal programs that illustrate some of the common styles of server-side forms programming.
 |  |  |
| 8.6. Applying Styles to Documents |  | 9.2. The <form> Tag |
Copyright © 2002 O'Reilly & Associates. All rights reserved.