2.1.0 • Published 8 years ago

daccord-validation v2.1.0

Weekly downloads
20
License
ISC
Repository
github
Last release
8 years ago

D’accord

Kickoff validation plugin for forms. Uses HTML 5 form attributes to trigger validation tests.

Usage

var Daccord = require('daccord-validation');
new Daccord(document.querySelector('form'));
//or
new Daccord(document.querySelector('form'), options);
<form class="l-container" action="/somewhere">
	<div class="form-controlGroup">
		<label class="form-label" for="field1">Text, required, maxlength 10</label>
		<input class="form-input" id="field1" name="field1" type="text" required maxlength="10">
	</div>
	<div class="form-controlGroup">
		<label class="form-label" for="field2">Email, required</label>
		<input class="form-input" id="field2" name="field2" type="email" required>
	</div>
	<div class="form-controlGroup">
		<label class="form-label" for="field3">Text, required with message</label>
		<input class="form-input" id="field3" name="field3" type="text" data-val-required="This field is required" required>
		<div class="form-message"></div>
	</div>
	<button class="btn btn--primary" type="submit">Submit</button>
</form>

Error messages are shown if there is an element with the class of form-message in the same form-controlGroup as the input field.

has-error and has-success are added to the form-controlGroup to indicate success or failure.

Options

fields

Type: String
Default: input, select, textarea

Fields to validate.

inlineErrors

Type: Boolean
Default: false

errorClass

Type: String
Default: has-error

successClass

Type: String
Default: has-success

focus

Type: Boolean
Default: false

liveValidation

Type: Boolean
Default: false

API

RuleTriggered byError message
Required fieldrequired or data-val-required attributedata-val-required="Message"
Max lengthmaxlength="num" or data-val-length-max="num"data-val-length="Message"
Min lengthminlength="num" or data-val-length-min="num"data-val-length="Message"
Patternpattern="regex" or data-val-regex-pattern="regex"data-val-regex="Message"
Emailtype="email"data-val-email="Message"
Matchesdata-val-equalto-other="name of other"data-val-equalto="Message"