HTML5 forms - HTML5 and CSS3 - page 62

instance, a PIN number) or because the field expects a one-off value
where past values entered are likely to be irrelevant (such as a pass-
word-reset code):
<label>Account: <input type="text" name="ac" autocomplete="off"></label>
<label>PIN: <input type="password" name="pin" autocomplete="off"></label>
Extending forms with JavaScript
There are several other enhancements to forms in HTML5 over and above
the new controls. These include ways to access validity information
through JavaScript as well as convenience features that either
completely replace the JavaScript you would commonly write for
every form today or make various scripting operations much easier.
Customizing the validation messages
The default validation messages are a little bland. And although the
pattern attribute allows you to include a custom message in the title
attribute, there's no attribute you can use to provide a custom message
to the other input types. But you can supply a custom message in
script.
Use the setCustomValidity property of
the <input> element in the DOM :
var fldName =
document.getElementById('fullname');
fldName.oninvalid =
function () {
fldName.setCustomValidity("");
if (!fldName.validity.valid) {
fldName.setCustomValidity(
"Nameless ones are not " +
"allowed to take part"
);
}
};