Forms

Last update: 7 November, 2001

Forms are an excellent way to interact with the user. Forms are part of standard HTML and as such are widely supported by virtually every browser on the market.

Setting up most forms requires at least two steps. Step One is to create the form using HTML. HTML provides many interesting form INPUT elements for form creation, including: single-line TEXT fields, CHECKBOXes, clickable IMAGEs, RADIO buttons, HIDDEN data fields, RESET buttons, and SUBMIT buttons. HTML also provides three other cool ways of getting user input: scrolling SELECT list of items, drop-down menu OPTIONs, and a TEXTAREA data-entry field with multiple lines.

But I said there were two steps. Step two is to process the form. This could be as simple as sending a form to an email address or as complex as querying a database and returning a response to the user. Sending a form to an email address does not require anything beyond HTML (except the user having an SMTP server specified in their email program). Queyring a database or simply adding the user's input to a database requires some type of external handling. This handling could be a CGI (Common Gateway Interface) script, an ASP (Active Server Pages) application, Microsoft's Dynamic HTML data binding technology, a Cold Fusion application, or some other type of external handling. The point is that the handling cannot be done with standard HTML except in the case of an mailto form.

I also mentioned that forms require at least two steps. I had in mind a third step, which actually I would insert between Steps One and Two described above. That step would be form validation. Form validation can be accomplished either client-side using a scripting language such as JavaScript or server-side with any of the technolgies listed in Step Two.

Wow! There's a lot to forms. Below are some examples for you to disect and some references for you to peruse. Have fun!

Examples:

• A Simple Form (no wrap attribute set on textarea)
• A table-aligned form (textarea wrap attribute set to physical)
• A prefilled form
• Results of the prefilled form
• The table-aligned form with validation (text-area wrap attribute set to virtual)
• Setting the subject, cc, and/or bcc fields in the email message sent by a mailto form
• Responding to the User
• Performing Calculations & Validation
• Using the Netscape Library for US addresses, very strict
• Using the Netscape Library for International addresses, less strict
• Some Credit Card Numbers to test the forms with

References:

Carlos' FORMS Tutorial 1

A nice tutorial on forms that's been around for a long time.

Forms and Functions

An article from Webcoder.com on how to deal with forms through JavaScript.

An Intelligent Mail Form

Another good article from Webcoder.com.

Netscape's JavaScript Form Validation Library

An excellent library of functions for form validation.

A Complete Set of HTML Form Tutorials by Chuck Musciano

From his Tag of the Week series in Web Review.

• Introduction to Forms
• Form Buttons
• Creating Graphical Form Buttons
• The Button Tag
• Simple Text Entry Fields
• Handling Multiline Text Fields, textareas
• Creating Checkboxes
• Creating Radio Buttons
• Creating Form Pull-Down Menus
• Creating a Scrolling List, a variation of the pull-down menu
• Nested Menus, an HTML 4.0 addition
• Creating a File Selector Element
• Labeling Form Elements
• Defining Explicit Labels
• Creating Field Sets
• Life Without Mice, setting the tab order
• Building Forms with Tables, controlling form layout with tables

Copyright © 1998-2001 by Tina McDuffie