Usable Forms for the Web

by Andy Beaumont

• ISBN13: 9781904151098
• ISBN10: 1904151094
• Format: Trade Paper
• Copyright: 2002-06-28
• Publisher: WROX

Summary

Explores how to make online registration, feedback, and ordering forms more usable, covering client-side forms in HTML and Flash, client- and server-side form validation techniques, and server-side data processing.

Table of Contents

Introduction	1	(1)
Who Is This Book For?	2	(1)
What's Covered/Chapter Synopsis	2	(2)
Conventions	4	(1)
Support/Feedback	5	(1)
Web Support	5	(2)
HTML forms	7	(54)
A Quick Introduction to Forms	8	(2)
Controls	10	(5)
The <form> Element	11	(1)
Form Element Syntax	12	(1)
Attributes	12	(3)
Control Types	15	(35)
Text Input	15	(5)
Buttons	20	(3)
Checkboxes	23	(3)
Radio Buttons	26	(2)
Select Boxes or Menus	28	(7)
File Select	35	(1)
Hidden Controls	36	(3)
Object Controls	39	(1)
Labels	40	(1)
Adding Structure Using <fieldset> and <legend> Elements	41	(3)
Giving Focus to an Element	44	(4)
Disabled and Read-only Controls	48	(2)
Form Submission	50	(1)
HTTP get	50	(1)
HTTP post	50	(1)
Sample Forms	51	(7)
e-Mail Feedback Form	51	(2)
About Yourself Form	53	(5)
Summary	58	(3)
Designing Usable Forms	61	(32)
Before You Design the Form	61	(3)
Before You Design the Form - Summary	64	(1)
Designing the Form	64	(23)
Accessibility	65	(1)
Selecting Types of Controls	65	(5)
Grouping Controls	70	(5)
Labeling Controls	75	(2)
Layout of Forms	77	(1)
Using Tables for Layout	77	(2)
Required Information	79	(1)
Careful Placement of Buttons	80	(2)
Providing Alternative Text or Descriptions for Images	82	(1)
Tab Index	82	(1)
Using Single Columns of Form Controls	83	(1)
Keeping Field Info Next To or Above Fields	83	(1)
Colors	84	(1)
Shading of Multiple Rows in Tables	85	(2)
Layout of Forms - Summary	87	(1)
Testing the Form	87	(4)
Accessibility Test Tools	89	(1)
Site Logs and Statistics	90	(1)
Summary	91	(2)
Flash Forms	93	(26)
Introduction	93	(1)
The Server Side	94	(1)
Flash Form Elements	95	(1)
The Checkbox	95	(1)
The List Menu	95	(1)
The Radio Button	95	(1)
Buttons	96	(1)
Listbox	96	(1)
Example 1 - A Simple Feedback Form	96	(6)
Example 2 - Flight Booking Form	102	(15)
Summary	117	(2)
Forms and ASP	119	(48)
Retrieving Form Data	120	(2)
Retrieving Data from an HTTP GET Method	120	(1)
Retrieving Data from an HTTP POST Method	121	(1)
Building the Pizza This Sample Application	122	(2)
Maintaining State and Passing Data Between Pages	124	(19)
The Example Forms	126	(2)
Passing Form Data in Hidden Form Fields	128	(1)
Adding Hidden Input Controls to a Form to Pass Data Between Pages - order2.asp	128	(1)
Displaying Data from Hidden Form Fields - orderSummary.asp	129	(1)
Storing Form Data in Cookies	130	(1)
Taking Form Data from a Variable and Adding it to a Cookie - order2.asp	131	(1)
Writing the Second Form's Details to the Cookie - order3.asp	132	(1)
Displaying Cookie Data - orderSummary.asp	133	(1)
Storing Form Data in ASP's Session Object	134	(2)
Adding Form Data to the Session Object-order2.asp	136	(1)
Storing an Array in the Session Object - order3.asp	136	(1)
Retrieving Session Information - orderSummary.asp	137	(1)
Storing Form Data in a Database	138	(4)
Summarizing Dealing with Form Data	142	(1)
The Pizza This Application	143	(21)
Login Page	143	(2)
Delivery or Collection	145	(1)
Delivery Details and/or Phone Number	146	(2)
Ordering Pizza and Storing Delivery Information	148	(3)
Customizing the Pizza	151	(4)
Adding Pizza to the Cart and Displaying the Contents	155	(3)
Side Orders	158	(3)
Checking Out	161	(2)
What Next with the Order	163	(1)
Summary	164	(3)
Using Forms with PHP and MySQL	167	(56)
What You Need to Use this Chapter	168	(2)
PHP	168	(1)
MySQL	169	(1)
phpMyAdmin	169	(1)
What's Ahead in This Chapter	170	(1)
PHP and Form Data	170	(6)
PHP and get	171	(2)
Variables in PHP	173	(1)
An Aside - Some PHP Basics	174	(1)
PHP and POST	175	(1)
Preserving State with PHP	176	(22)
Hidden Form Fields	176	(1)
Using Form Data to Write Hidden Fields	176	(3)
Writing a Group of Similar Controls	179	(4)
The Final Question	183	(2)
Displaying the Results	185	(2)
Cookies	187	(1)
Storing Cookies in PHP	187	(1)
Retrieving Cookies in PHP	188	(1)
Using Cookies in Our Example	189	(2)
PHP and Sessions - Simple Example	191	(3)
Uploading Files with PHP	194	(1)
The Upload Form	194	(1)
Processing the File	195	(3)
Storing and Retrieving Data	198	(23)
Creating the Database	198	(1)
Updating the Survey	199	(1)
Intro Page	199	(2)
The First Survey Page	201	(3)
The Second Survey Page	204	(3)
The Third Survey Page	207	(2)
The Fourth Survey Page	209	(2)
The Respondent's Results Page	211	(5)
The Survey Results Page	216	(4)
Finding Out More	220	(1)
Summary	221	(2)
Form validation Techniques	223	(76)
Client Versus Server	224	(1)
Client-side Validation	225	(42)
Browser Compatibility Issues	225	(2)
Validating Text Input	227	(1)
Comparing Text Field Values	227	(3)
Required Text Fields	230	(4)
Validating Text Input with Regular Expressions	234	(12)
Non-Text Inputs	246	(1)
<select> and <option> Elements	246	(2)
Radiobutton Elements	248	(3)
Checkbox Elements	251	(2)
Putting It All Together	253	(14)
Server-side Validation Techniques	267	(29)
Overview	267	(1)
PHP Specifics	268	(1)
Regular Expressions and RegExp Functions	268	(1)
String Functions	269	(2)
Security Issues	271	(1)
Generic Form Handler	272	(11)
ASP Specifics	283	(1)
Regular Expressions in VBScript	283	(1)
VBScript String Functions	284	(1)
Some ASP / IIS Security Issues	285	(1)
Generic Form Handler	285	(11)
Summary	296	(3)
Advanced Client-side Form Scripting	299	(34)
Accessing Form Elements in JavaScript	300	(2)
Text Input	302	(6)
Focus on First Form Item	302	(1)
Auto Tabbing to Next Field When Field is Full	302	(2)
Disabling a Text Input	304	(1)
Case Conversion	305	(1)
Trimming Spaces from Beginning and End of Fields	306	(1)
Ignoring Spaces	307	(1)
Text Areas	308	(11)
Word Counter	309	(1)
Character Counter	310	(1)
Selecting All of the Content of a Text Area	311	(1)
Finding Characters using replace()	312	(2)
Finding Characters Using indexOf()	314	(2)
Replacing Characters Using indexOf()	316	(1)
Escaping and Unescaping	317	(1)
Style Sheets for a Text Area	318	(1)
Checkboxes	319	(2)
Check and Uncheck All	319	(1)
Count Checkboxes	320	(1)
Select Boxes	321	(6)
Conditional Select Box	321	(4)
Adding Items from a Select Box to a Text Input	325	(2)
Submit Button	327	(1)
Enforcing Checking a Checkbox Before Submitting	327	(1)
Using a Link Instead of a Submit Button	328	(1)
Passing Values Between Pages	328	(2)
Summary	330	(3)
Forms in ASP NET	333	(44)
A Brief Introduction to .NET	334	(2)
Getting ASP.NET Running	335	(1)
Installing ASP.NET and the .NET Framework SDK	336	(1)
HTML Forms and ASP.NET Web Forms	336	(31)
How Forms Work in ASP.NET	338	(1)
The Page Object	338	(1)
Postback	339	(5)
Testing the Form for Postback	344	(1)
ASP.NET Server WebControls	344	(20)
Applying Style to WebControls	364	(3)
Summary	367	(4)
Resources	371	(6)
Accessibility	371	(1)
ASP	371	(1)
ASP.NET	372	(1)
Cookies	372	(1)
CSS	372	(1)
Document Object Model/Dynamic HTML	372	(1)
Flash/ActionScript	373	(1)
JavaScript	373	(1)
PHP	373	(1)
Regular Expressions	374	(1)
Security Issues	374	(1)
SQL/MySQL/SQL Server	374	(1)
Usability	375	(2)
Index	377