neko-formvalidator v3.0.0

Form Validator powered by NekoDev

Validator is an extensible class for form validation.

Getting Start

import Validator, { Required, Numeric, Min } from 'FormValidator';

Validator.use([Required, Numeric, Min])

let form = document.getElementById('form-test');
let validator = new Validator(form);

form.addEventListener('submit', function (e) {
    e.preventDefault()
    let results = validator.validate({
        'name': 'required',
        'age': 'required|numeric|min:18',
    });

    console.log(results)
})

You can chain rules with a pipe like this :

'age': 'required|numeric|min:18'

Using a validation rule

For using a validation rule, you need import it :

import Validator, { Required, Max, Min } from 'FormValidator'

Validator.use(Required)
Validator.use(Max)
Validator.use(Min)

You can inline the user method like this :

Validator.user([ Required, Min, Max ])

For debugging, you can console.log the Rule description :

console.log(Required.Description)

You can customize the Rule error message :

Required.ErrorMessage = "My custom message"

Create a custom validation rule

import { Rule } from "FormValidator";

export default class CustomRule extends Rule {

    static Description = `La valeur du champs doit être "TEST".` // Developper Help Message
    static ErrorMessage = `La valeur du champs est incorrect !` // Error Message

    constructor() {
        super('customRule') // Rule name
    }

    applyRule() {
        this.setErrorMessage(CustomRule.ErrorMessage)
        if (this.input != "TEST") return this.error()
    }

}

A validation rule must extends of Rule class.
In the constructor, your must call super method ans pass the custom rule name.
It's recommanded to set startics Description and ErrorMessage.
The applyRule method contains the logic of your validation rule. In the applyRule method, call the error method when the rule fail.

Create custom validation with paramters

import { Rule } from "FormValidator";

export default class CustomRule extends Rule {

    static Description = `La valeur du champs doit être égale à la valeur passé en paramètre.` // Developper Help Message
    static ErrorMessage = `La valeur du champs est incorrect !` // Error Message

    constructor() {
        super('customRule') // Rule name
    }

    applyRule(params) {
        this.setErrorMessage(CustomRule.ErrorMessage)
        if (this.input != params) return this.error()
    }

}

On the front you can use the rule like this :

import Validator from 'FormValidator'
import CustomRule from './Rules/CustomRule'

Validator.use(CustomRule)

let validator = new Validotor(document.getElementById('my-form'))

let results = validator.validate({
    name: 'customRule:TEST'
})

The value expected in this exemple is the content after the :. customRule is the name of the rule and all after the : is the value expected (TEST).

Default Rule list

You can add nullable rule for input not required but if not null, must match with a specific rule :

form.validate({

    'age' : 'numeric|min:18|nullable'

})

Powered with :heart: By NekoDev !

Follow me on Twitter