Lightweight JavaScript form validation, string validation validator.js

Lightweight JavaScript form validation, string validation. No dependencies, support UMD, ~3kb.

Github: validator.js

Official website of validator.js => Example application

Install and use

The module

Reference the validator.min.js file in your application

$ npm install validator.tool --saveCopy the code

Called in a.js file

// String validation
var validator = require('validator.tool');
var v = new validator();
v.isEmail('[email protected]');
v.isIp('192.168.23.3');
v.isFax(' ');

// Form validation
var a = new validator('example_form', {...},function(obj,evt){
    if(obj.errors){
        // Check if there is an error}})Copy the code

Client use

Reference the validator.min.js file in your application

<script type="text/javascript" src="dist/validator.min.js"></script>Copy the code

Use methods in JS.

<script type="text/javascript">
  var v = new Validator();
  v.isEmail('[email protected]');
  v.isIp('192.168.23.3');
</script>Copy the code

Methods applied to forms.

<form id="example_form">
    <div>
        <label for="email">Email address verification</label>
        <input type="email" name="email" id="email" class="form-control" placeholder="Email">
    </div>
</form>
<script type="text/javascript">
  var validator = new Validator('example_form'[{/ / the name field
        name: 'email',
        display:"You input is not {{email}} is a legitimate email | | not empty too long | too short".// Verify the condition
        rules: 'is_emil|max_length(12)'
        // rules: 'valid_email|required|max_length(12)|min_length(2)'}, {/ / the name field
        name: 'sex',
        display:"Please select gender {{sex}}".// Verify the condition
        rules: 'required'}].function(obj,evt){
      if(obj.errors){
          // Check if there is an error}})</script>Copy the code

documentation

new Validator(formName, option, callback)

formName

FormName is the id or name value of the

option

• name– > in the inputnameThe value of the corresponding
• display-> Verify the error to prompt text{{the middle is the value of name}}

• Rules – > one or more rules (center) with | interval

  • is_email-> Verify a valid mailbox
  • is_ip-> Verify the valid IP address
  • is_fax-> Verify faxes
  • is_tel-> Verify the landline
  • is_phone-> Verify the phone
  • is_url– > validation URL
  • required-> Specifies whether this parameter is mandatory
  • max_length-> Maximum length of characters
  • min_length-> Minimum length of characters

{
    / / the name field
    name: 'email',
    display:"You input is not {{email}} is a legitimate email | | not empty too long | too short".// Verify the condition
    rules: 'is_email|max_length(12)'
    // rules: 'valid_email|required|max_length(12)|min_length(2)'
}Copy the code

callback

var validator = new Validator('example_form', {...}, {...},function(obj,evt){
    //obj = {
    // callback:(error, evt, handles)
    // errors:Array[2]
    // fields:Object
    // form:form#example_form
    // handles:Object
    // isCallback:true
    // isEmail:(field)
    // isFax:(field)
    // isIp:(field)
    // isPhone:(field)
    // isTel:(field)
    // isUrl:(field)
    // maxLength:(field, length)
    // minLength:(field, length)
    // required:(field)
    / /}
    if(obj.errors.length>0) {// Check if there is an error}})Copy the code

example

String validation

var v = new Validator();
v.isEmail('[email protected]'); / / - > validation legitimate email | = > return Boolean value
v.isIp('192.168.23.3'); / / - > validation legal IP address | = > return Boolean value
v.isFax(' '); / / - > validation fax | = > return Boolean value
v.isPhone('13622667263'); / / - > verify phone | = > return Boolean value
v.isTel('021－324234-234'); / / - > validation machine | = > return Boolean value
v.isUrl('http://JSLite.io'); / / - > validation URL | = > return Boolean value
v.maxLength('JSLite'.12); / / - > maximum length | = > return Boolean value
v.minLength('JSLite'.3); / / - > minimum length | = > return Boolean value
v.required('23'); / / whether - > is mandatory (for null) | = > return Boolean valuesCopy the code

Validation in forms

Click the Submit button to verify

var validator = new Validator('example_form'[{/ / the name field
        name: 'email',
        display:"You input is not {{email}} is a legitimate email | | not empty too long | too short".// Verify the condition
        rules: 'is_email|max_length(12)'
        // rules: 'valid_email|required|max_length(12)|min_length(2)'}, {/ / the name field
        name: 'sex',
        display:"Please select gender {{sex}}".// Verify the condition
        rules: 'required'}].function(obj,evt){
    if(obj.errors){
        // Check if there is an error}})Copy the code

No Submit validation

var validator = new Validator('example_form'[{/ / the name field
        name: 'email',
        display:"You input is not {{email}} is a legitimate email | | not empty too long | too short".// Verify the condition
        rules: 'is_email|max_length(12)'
        // rules: 'valid_email|required|max_length(12)|min_length(2)'}, {/ / the name field
        name: 'sex',
        display:"Please select gender {{sex}}".// Verify the condition
        rules: 'required'}].function(obj,evt){
    if(obj.errors){
        // Check if there is an error
    }
})
validator.validate()Copy the code

reference

Take these great libraries and whip it out.

• Chriso /validator.js is a library for string validators and conversion types
• Validate.js is a lightweight JavaScript form validation library inspired by CodeIgniter.