Learning Flex 4

Chapter 10. Creating Rich Forms

IN THIS CHAPTER

Preparing a Form-Based Application

Validating Data

Restricting Input

Formatting Input

Combining Restrictions and Formatters

Linking Formatters to Functions

Summary

“Fast is fine, but accuracy is everything.”

—Wyatt Earp

Have you ever filled out an HTML form on a website, submitted it, and waited for the result—only to find that one of the fields had an error? How easy was it to find your mistake? Was it something silly like not putting parentheses around the area code of a phone number, or perhaps adding them when they weren’t needed? Wouldn’t it be nice if that never happened again?

With Flex, validating and formatting user input is a cinch. Built into the most common controls are helpful methods that provide feedback when user-submitted values are problematic; similarly, it’s easy to link Flex inputs with nonvisual formatter components that automatically sculpt data into preferred formats. Working together, Flex validators and formatters give your applications a helpful, responsive UI. As a bonus, of course, cleaner user input also means a cleaner database.

In this chapter, we create an input form that collects contact information for the purpose of demonstrating data validation and input formatting techniques.

Preparing a Form-Based Application

To get started, we construct a form layout complete with first and last name, email, phone, address, and zip code fields, and for the fun of it, we also play with the DateField and ColorPicker controls. ...