validator-laravel

Client-side Javascript Validator library. Ports from Laravel 5.2

Usage no npm install needed!

<script type="module">
  import validatorLaravel from 'https://cdn.skypack.dev/validator-laravel';
</script>

README

Javascript Validator library

Travis build npm

Client-side javascript validator library. Ports from Laravel 5.2

Installation

  1. Included as global <script>, copy the Validator.js file inside dist directory to your project directory and reference it in the script tag. Or, you can use NPMCDN to reference it like so,

    <head>
        <script src="public/js/Validator.js"></script>
        <!-- or using NPMCDN -->
        <script src="https://unpkg.com/Validator"></script>
    </head>
    
  2. Using NPM

    npm install Validator --save
    
    var Validator = require('Validator')
    

Usage

  • Basic usage
    var data = {
        name: 'John Doe',
        company: 'Example Co.',
        birthday: '1985-04-16'
    }
    var rules = {
        name: 'required',
        // for multiple rules
        birthday: 'required|date', // can be a piped string
        company: ['required', 'string'] // can be an array of strings
    }
    
    var v = Validator.make(data, rules)

    if (v.fails()) {
        var errors = v.getErrors()
        console.log(errors)
    }

getErrors() will return an object containing error field as a key and array of error messages for that field.

  • Custom Error Messages
    const messages = {
        // custom message for based rules
        'required': 'You forgot the :attr field',
        'email': ':attr is not valid',
        // custom message for specific rule of attribute
        'receiver.email': 'The receiver email address is not valid'
    }
    
    var v = Validator.make(data, rules, messages)
    
    if (v.passes()) {
        //...
    }
  • Custom Name
    var v = Validator.make(data, rules, messages, { 'email': 'Email Address' })

Supported Validation Rules

See validation rule usage in Laravel Documentation

  • accepted
  • after (date)
  • alpha
  • alpha_num
  • alpha_dash
  • array
  • before (date)
  • between
  • boolean
  • confirmed
  • date
  • different
  • digits
  • digits_between
  • email
  • filled
  • in
  • integer
  • ip
  • json
  • max
  • min
  • not_in
  • numeric
  • present
  • regex
  • required
  • required_if
  • required_unless
  • required_with
  • required_with_all
  • required_without
  • required_without_all
  • same
  • size
  • string
  • url

Extending with Custom Validation Rules

The validator can be extended with custom rules

    var rules = {
        id: 'required|mongoid'
    }

    function validateMongoId(name, value, params) {
        let hexadecimal = /^[0-9A-F]+$/i
        return value && hexadecimal.test(value) && value.length === 24
    }
    
    var v = Validator.make(data, rules)
    v.extend('mongoid', validateMongoId, ":attr is not a valid mongo id")

    
    if (v.passes()) {
        //...
    }

validator.extend takes three required parameters:

  • name: the name of the custom rule
  • callback: called when the rule is checked
  • validationMessage: error message text on validation failure

The validation callback receives three parameters:

  1. name: the field name being validated
  2. value: the given value in the data
  3. params: Any parameters, passed after the colon in the rule definition.

Params defined ike so: rulename:min=10,max=15 would be passed in as an array: ['min=10', 'max=15']