40 Chapter 3—Intelligent Forms
3.1.2 The Input Types “url” and “email”
In addition to suggesting options, the browser can also check the syntax for url
and email. Because there are concrete rules for e-mail addresses and Internet
addresses in the form of URLs, the browser can already provide feedback on pos-
sible mistakes during input (more on this topic in section 3.4, Client-side Form
Validation).3.1.3 Date and Time with “datetime”, “date”, “month”, “week”,
“time”, and “datetime-local”
Let’s take a closer look at the date and time formats. datetime contains date
and time information; the time zone is always set to UTC. The specification
states that the browser can allow the user to select another time zone, but the
value of the input element has to be converted to UTC. The rules for time in-
formation in the datetime attribute of the time element, which we discussed in
section 2.7.2, The “time” Element, apply here as well—with the only exception
that the string always has to end in a Z, the identifier of UTC.
With date and month, the time and time zone are omitted. As defined in the speci-
fication, the date must be a valid day within the selected month, also taking into
account leap years. Year, month, and day must be separated by a minus charac-
ter; the year has to be at least four digits long and greater than 0. So dates before
Christ (b.c.) cannot be represented in HTML5, in contrast to the somewhat more
extensive international standard ISO 8601.
The type week is represented as a week in a year, and it is mandatory that the
week be preceded by the year. Year and week are once again separated by a mi-
nus character. To ensure that there is no confusion with month, the week must be
preceded by the character W.
datetime-local works the same way as the already described datetime; the only
difference is that there is no timezone specified.
Opera uses a calendar window for selecting the date; the time can be entered
manually or changed via arrow keys (refer to Figure 3.1).3.1.4 The Input Types “number” and “range”
The types number and range require input that can be converted to a numeri-
cal value; the notation of floating-point numbers (for example, 2.99792458E8) is
valid. Regarding the type range, the specification states that the exact value is not
relevant; this type indicates a range of numbers, not an exact number, and the
user can easily enter it with a slider bar. Both Opera and WebKit-based browsers,
such as Safari or Google Chrome, use a slider bar to represent this type (refer to
Figure 3.1 and see Figure 3.2).