Validate

Validate

new Validate(el, options)

Source:
Properties:
Name Type Description
options.ajax Boolean

should prevent default be called when submitting the form
options.rules Boolean

form validation rules

Handles form validation, and nothing else

Example
js:
const $form = document.querySelector('[data-form-delivery]')
const validator = new Validate($form, {
	rules: {
		email: {
			presence: true,
			email: true
		},

		firstName: {
			presence: true
		},

		surname: {
			presence: true
		}
	},
	ajax: true
})

validator.mount()

validator.on('submit:success', ({ data }) => {
	fetch(data, {
		method: 'POST'
	})
	.then(response => response.json)
	.then(data => {
		// handle the response
	})
})

html:
<form>
	<div class="flex-1" data-field-row="">
		<label for="firstName">First Name*</label>
		<input type="text" name="firstName" id="firstName" required>
	</div>
	<button type="submit">Submit</button>
</form>
Parameters:
Name Type Description
el HTMLElement

the form to validate
options Object

any form options

Methods

(static) handleErrors(elm) → {void}

Source:

add/remove errors

Parameters:
Name Type Description
elm HTMLElement

element that has changed
Returns:
Type
void

(static) mount() → {Validate}

Source:

bootstrap the form, add events

Returns:
Type
Validate

(static) onChange(e, elm) → {void}

Source:

Listen to change events on required fields

Parameters:
Name Type Description
e Object

event object
elm HTMLElement

element that has changed
Returns:
Type
void

(static) onSubmit(e) → {void}

Source:

handle form submission, check for errors and emit events

Parameters:
Name Type Description
e Object

the events object
Returns:
Type
void

(static) setForm(form) → {Validate}

Source:

set the form

Parameters:
Name Type Description
form HTMLElement

the form element to validate
Returns:
Type
Validate

(static) setOptions(options) → {Validate}

Source:

update the options

Parameters:
Name Type Description
options Object

validation rules and options
Returns:
Type
Validate

(static) showError(input) → {void}

Source:

update the fields classes and remove the error message

Parameters:
Name Type Description
input Object

the fields object - includes, input, parent and message nodes
Returns:
Type
void

(static) showError(input, error) → {void}

Source:

update the fields classes and inject the error message

Parameters:
Name Type Description
input Object

the fields object - includes, input, parent and message nodes
error Array

an array of errors
Returns:
Type
void

(static) unmount() → {void}

Source:

remove the events and error nodes

Returns:
Type
void