HTML5 Form Validator

The simplest HTML5 forms validator.

This form validator uses the built-in capabilities of the browser to validate the required form fields.

All validation messages are shown as they are shown by the browser which means that they are internationalized and are NOT subject to change.

Visitor stats

Code stats

Install

npm i html5-form-validator

or

yarn add html5-form-validator

Usage

import { HTML5FormValidation } from 'html5-form-validator';

Then initialize with default settings:

new HTML5FormValidation();

or supply your own

const form = document.querySelector('#form');

new HTML5FormValidation(form, {
	errorElement: 'form__error',
	invalidClass: 'is--invalid',
	submitHandler(instance) {
		console.log(instance);
	},
	validateOnInput: false
});

Options

Option	Type	Required	Default	Description
errorElement	string	false	'error'	The class name of the element that will be added to the DOM after the required field.
invalidClass	string	false	'invalid'	The classname of the required field when it is invalid
submitHandler	Function	false	null	A function to run on form submission. Accepts a single argument - the HTML5FormValidation instance.
validateOnInput	boolean	false	true	Validate as you type. Set to false to validate only on submit.

LICENSE

MIT

---

Connect with me:

                     

---

Support and sponsor my work: