Game Development Reference
In-Depth Information
<input type="submit" value="Save" />
</form>
Normally, you'll want to have two separate fields in your forms when asking for a first
and last name. However, asking for a full name in a single field makes the field a
great candidate for a custom pattern attribute.
The pattern used to validate a full name in this case is pretty simple; we look that the
input as a word between 2 and 16 word characters (letters, and in this case possibly
even numbers), followed by a single white space, which is in turn followed by anoth-
er word of length greater than two, but less than 16 characters.
A placeholder string is added to both
input field
elements to avoid the need for
extra labels in the form. This way the form can be nice and concise, yet descriptive
enough that the user is never confused about what the form is asking.
Data attributes
When you need to need to store data in an HTML element and there is no other
attribute that would be more appropriate to hold that data, the HTML5 specification
provides a special attribute for this very situation. Although the specification specific-
ally refers to this attribute a
custom data
attribute, most people simply call them
as the
data
attributes.
The way these
custom data
attributes work is very simple. Simply create the attrib-
ute name of your choice starting the name keyword with the prefix
data-
, then using
any keyword of your choice that is at least one character in length. The only restric-
tion is that the keyword must not contain any uppercase letters, although all HTML
element attributes get lowercased automatically by default. You may add an arbitrary
amount of such custom attributes to a single element. Finally, any
custom data
attributes may have any value of your choice, have the empty string as its value, or
be empty, in either case the attribute is considered to have the value true (and the
value false in its absence).
<!-- Indicates an element that display some
sort of score -->
