What is form validation?
when we got to any of popular site to register, we notice that they provide feedback when we didn’t fill the data or filled in correct format. we will get message such as:-
“This field is requied(when we leave the field blank).”
“Please enter your phone number in the format XXXXX”(When the data entered is not in correct format).
“Please enter the valid email address.”( when the email entered is not in correct format).
” Password needs to be between 8 to 20 character long and must contain one upper case letter, one symbol and a number.”( A very specific data format is required for the data).
This is called form validation.
OR
Before submitting the data to the server, it is important to ensure that all the fieds are correctly filled. This is called client side validation. It help us to ensure that the data entered matches the requirement. If the data entered is incorrect or simply missing, the server send the data back to the client requesting to resubmit the form with correct data.
There are two types or validation:-
- Client side validation:- When the validation is done on the browser is called client side validation.
- Server side validation:- when then the validation is done on server is called server side validation.
Three main reasons of validation:
- We want to get the right data, in the right format.
- We want to protect our users data.
- We want to protect ourselves.
Different types of client side varification:-
There are two types of validation:-
- built-in form validation:– It uses the HTML5 validation features. This validation generally doesn’t require much JavaScript. Built-in form validation has better performance than JavaScript, but it is not customizable as JavaScript validation.
- JavaScript:- JavaScript validation is coded using JavaScript. this is completely customizable, but we need to create it or use a library.
Form validation performs 2 functions:-
- Basic validation:- In this validation the is checked that all the mandatary fields must be filled.
- Data Format Validation:- In this validation it is checked that all the filled data must be of correct form and value.
Using built-in form validation
One of the most significant features of html5 is the ability to validate user data without relying on JavaScript. This is done by using the validation attributes on form elements. Some of the attributes are written below:
- required: It specifies that whether a form field needs to be filled in before submitting.
- minlength: Specifies minimum length of the data.
- maxlength: Specifies the max length of the data.
- pattern: Specifies a regular expression that defines the entered data need to be follow.
Tagged : form validation / Javascript
