Simple Client-side Form Validation Plugin For jQuery - Validator

Validator is a brand new jQuery form validation plugin that that makes it easy to add validation to existing form elements. Support mostly HTML/HTML5 standard input type attributes and custom validation rules & error messages.

How to use it:

1. Include jQuery JavaScript library and the jQuery Validator plugin in your project.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="dist/validator.js"></script>

2. Apply validation rules to your form elements.

$('input').validator({
  // rules, options and callbacks
});

3. Validation rules available.

$('input').validator({
// Types
number: 
email: 
url: 
date: 

// Attributes
required: 
min: 
max: 
minlength: 
maxlength: 
pattern: 

// Customs
range: 
rangelength: 
equalto
});

4. Default settings.

$('input').validator({

// Type: Object
/* e.g.: {
minlength: 8,
maxlength: 16
} or {
rangelength: [8, 16]
} or {
rangelength: {
  message: 'Please enter a value between 8 and 16 characters long.',
  validator: function (value) {
    return /^.{8,16}$/.test(value);
  }
}
} */
rules: null,

// The event(s) which triggers validating
// Type: String
trigger: '',

// Filter the value before validate
// Type: Function
filter: null,

// A shortcut of "success.validator" event
// Type: Function
success: null,

// A shortcut of "error.validator" event
// Type: Function
error: null

});

5. Default error messages.

// Types
number: 'Please enter a valid number (only digits).',
email: 'Please enter a valid email address.',
url: 'Please enter a valid URL.',
date: 'Please enter a valid date.',

// Attributes
required: 'This field is required.',
max: 'Please enter a value less than or equal to [0].',
min: 'Please enter a value greater than or equal to [0].',
maxlength: 'Please enter no more than [0] characters.',
minlength: 'Please enter at least [0] characters.',
pattern: 'Please enter a matched value.',

// Customs
range: 'Please enter a value between [0] and [1].',
rangelength: 'Please enter a value between [0] and [1] characters long.',
equalto: 'Please enter the same value again.'

6. Public methods.

// Update rule(s) from element attributes to validator instance.
$input.validator('update');

// addRule(name, value)
$().validator('addRule', 'required', true);

// removeRule(name)
$().validator('removeRule', 'required');

// addValidator(name, value)
$().validator('addValidator', 'required', function (value) {
  return !!value;
});
$().validator('addValidator', {
  required: function (value) {
    return $.trim(value) !== '';
  }
});

// removeValidator(name)
$().validator('removeValidator', 'required');

// Start a validation and return the reversed result.
isInvalid();

// A shortcut of isValid method, means "√".
v();

// A shortcut of isInvalid method, means "×".
x();

// Destroy the validator and remove the instance from target element.
destroy()

Change log:

v0.1.0 (2016-04-30)

• Added a new method: "update".
• The priority of rules option is greater than element attributes now.
• Improved event binding.
• Improved code style.
• Improved documentation.

---

This awesome jQuery plugin is developed by fengyuanchen. For more Advanced Usages, please check the demo page or visit the official website.