Access and secure data - Programming in HTML5 with JavaScript and CSS3 - page 193

The <input> element in HTML denotes input controls. This element contains a type attri-
bute that specifies the type of input element to render. The exceptions to the <input type=''>
rule are the <textarea> and <button> elements, which have their own element support.
Table 3-1 outlines the input elements supported in HTML5 and indicates whether an ele-
ment is now supported in Internet Explorer. The additional attributes available to an <input>
element are discussed in later sections.

TABLE 3-1 HTML5 input elements

Element Description

color *

Provides a color picker

date * Provides a date picker

datetime * Provides a date/time picker

month *

Enables users to select a numeric month and year

week * Enables users to select a numeric week and year

time * Enables users to select a time of day

number * Forces the input to be numeric

Allows users to select a value within a range by using a slider bar Range

tel * Formats entered data as a phone number

Formats entered data as a properly formatted URL url

Radio † Enables users to select a single value for a list of choices

Checkbox †

Enables users to select multiple values in a list of choices

Password † Captures a password and glyphs the entered characters

Button † Enables users to perform an action such as run script

Reset †

Resets all HTML elements within a form

Submit † Posts the form data to a destination for further processing

*Not supported currently by Internet Explorer
†Not new in HTML5

Using text and textarea input types
The text and textarea input controls are the most flexible. By using these controls, you allow
users to enter any text that they want into a regular text box. A text box provides a single-line
text entry, whereas a textarea allows for a multiline data entry. The following HTML shows the
markup for both types of controls:

<table>
<tr>
<td>
First Name:
</td>