Ken Walsh

Web Page Design Foundations

9. HTML Form Validation


HTML form validation allows the browser to check for certain type of errors in HTML form so that the user can correct them before the form is submitted.


Required Attribute


The input element can contain the required attribute to tell the browser the element must be filled in before the browser processes the form. Below is an example of the required attribute.


<input type="text" name="FirstName" required>

Maximum Length


The maximum length attribute specifies the maximum length that can be enterd into an input field. See example below.


<input type="text" name="FirstName" maxlength="20">

Auto Focus


The autofocus attribute specifies which field should have focus when when the browser page has been loaded. The autofocus attribute is shown in the inpupt tag below.


<input type="text" name="FirstName" autofocus>

Placeholder Attribute


The placeholder attribute puts reminder text in the field to show the user what should be typed in the input field. The placholder attrbute is shown below.


<input type="text" name="FirstName" placeholder="first name">

A modified form with the above validation is at: Camp Sunny Example with validation.