Peter Lubbers - Pro HTML 5 Programming

176
CHAPTER 7 ■ USING THE HTML5 FORMS API
Using the HTML5 Forms APIs
Now that we’ve spent some time familiarizing ourselves with the new form element types, let’s turn to
the attributes and APIs that are present on both the old and new form controls. Many of them are
designed to reduce the amount of scripting needed to create a powerful web application user interface.
You may find that the new attributes give you the power to enhance your user interface in ways that you
had not considered. Or, at the very least, you may be able to remove blocks of script in your existing
pages.
New form attributes and functions
First, we’ll consider new attributes, functions, and a few elements that did not previously exist in earlier
versions of HTML. Like the new input types, it is generally safe to use these attributes today, whether or
not your target browser supports them. This is because the attributes will be safely ignored by any
browser on the market today if the browser does not understand them.
The placeholder Attribute
The placeholder attribute gives input controls an easy way to provide descriptive, alternate hint text
which is shown only when the user has not yet entered any values. This is common in many modern
user interface frameworks, and popular JavaScript frameworks have also provided emulation of this
feature. However, modern browsers have it built-in.
To use this attribute, simply add it to an input with a text representation. This includes the basic text
type, as well as the semantic types such as email, number, url, etc.
Runner:
In a supporting browser, such as Google Chrome, this causes the field to display a faint version of
the placeholder text which will disappear whenever the user or application puts focus into the field, or
whenever there is a value present.
The same attribute, when running in a non-supporting browser, will just be ignored, causing the
default field behavior to display.
Similarly, whenever a value is entered in the field, the placeholder text will not appear.