Forms - JavaScript: Novice to Ninja - page 280

Now refresh the page and leave the name field blank. As you click in another field, you'll
notice that the blank name field is highlighted because it is a required field, similar to the
screenshot in Figure 8.7 .
Figure 8.7. This is a required field
You can find more information about the HTML5 validation API in this article by Craig
Buckler on SitePoint.
It is also possible to implement custom form validation using JavaScript. For example, say
we wanted to exclude any superhero names that begin with an “X.” This is not a standard
form of validation, so we'd have to write our own. Add this code to scripts.js to see an ex-
ample of custom validation:
form.addEventListener("submit",validate,false);
function validate(event) {
var firstLetter = form.name.value[0];
if (firstLetter.toUpperCase() === "X") {
event.preventDefault();
alert("Your name is not allowed to start with X!");
}
}