Custom HTML5 Form Validator – native-validations

Category: Form , Javascript | February 1, 2018
Author: asimism
Views Total: 1,821
Official Page: Go to website
Last Update: February 1, 2018
License: MIT


Custom HTML5 Form Validator – native-validations


native-validations is a JavaScript library to enhance and replace the native HTML5 form validation with custom styles and error messages.

How to use it:

Download and import the native-validations library into the document.

<script src="form-validation.js"></script>

Add custom error message to the form fields using the following data attributes:

<input type="email"
       data-require-error="Email is required" 
       data-pattern-error="Invalid email format" 

<select multiple
        data-require-error="Select atleast 1 option from the list" 
    <option value="">Please select atleast one option</option>
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D">D</option>
    <option value="E">E</option>
    <option value="F">F</option>


Initialize the library to Validate the form on type or submit.


You Might Be Interested In:

Leave a Reply