If a form field (fname) is empty, this function alerts a message, and returns false, to prevent the form from being submitted:
The function can be called when the form is submitted:
HTML Form Example
Please input a number between 1 and 10Try it Yourself
Automatic HTML Form Validation
HTML form validation can be performed automatically by the browser:
If a form field (fname) is empty, the required attribute prevents this form from being submitted:
HTML Form Example
Automatic HTML form validation does not work in Internet Explorer 9 or earlier.
Data validation is the process of ensuring that computer input is clean, correct, and useful.
Typical validation tasks are:
Most often, the purpose of data validation is to ensure correct input to a computer application.
Validation can be defined by many different methods, and deployed in many different ways.
Server side validation is performed by a web server, after input has been sent to the server.
Client side validation is performed by a web browser, before input is sent to a web server.
HTML Constraint Validation
HTML5 introduced a new HTML validation concept called constraint validation.
HTML constraint validation is based on:
Constraint Validation HTML Input Attributes
|disabled||Specifies that the input element should be disabled|
|max||Specifies the maximum value of an input element|
|min||Specifies the minimum value of an input element|
|pattern||Specifies the value pattern of an input element|
|required||Specifies that the input field requires an element|
|type||Specifies the type of an input element|
Constraint Validation CSS Pseudo Selectors
|:disabled||Selects input elements with the "disabled" attribute specified|
|:invalid||Selects input elements with invalid values|
|:optional||Selects input elements with no "required" attribute specified|
|:required||Selects input elements with the "required" attribute specified|
|:valid||Selects input elements with valid values|
For a full list, got to CSS Pseudo Classes.