JSPM

jslidate

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q26516F
  • License MIT

Library for faster JS validation

Package Exports

  • jslidate

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (jslidate) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

JSLidate

JSLidate is libraray for JS validation

Sample usage

Code below creates Form object

    const impForm = new JSLidate({
        inputs: [{
            selector: '.input_1' ,
            rules: [minLength (1), maxLength (5)] ,
        }, {
            selector: '.input_2' ,
            rules: [minLength (2), maxLength (4), patternRule(/[a-b]/img, 'a-b alphanumeric')] ,
        }],
         form: {
            selector: '.form',
        },
        rejected: (wrongFilled) => document.getElementById('output').innerText = wrongFilled,
        config: {alwaysCancelSubmit : false}
    });

API

Creating rules

Rules are based on currying functions (sample functions are visible in RuleTypes.js file)

Example:

// ES6
const minLength = (length, pattern = length) => value => ({
    validate: value.length >= length,
    message: ['Minimal length', pattern],
});
// ES5
var maxLength = function(length, pattern) {
    return function(value) {
        return {
            validate: value.length <= length,
            message: ['Minimal length', pattern || length]
        };
    }
}

Callback function

JSlidate object applies callback for wrong filled form.

(wrongFilled) => console.log(wrongFilled);
  • wrongFilled: Array This contains an array of elements which did not get through the validation process.

EventListener

JSlidate object has EventListener (Observer).

eventListener is fully chainable.

class callbackObject {
    constructor() {

    }

    success() {
        console.log('We did it, form has been passed.');
    }
    
    reject() {
        console.log('We got some problems here!');
    }
}

impForm.eventListener
.add(new callbackObject())
.add(new callbackObject())

Adding callbackObject

impForm.eventListener
.add(new callbackObject());

callbackObject must contain success and reject functions.

Removing callbackObject

impForm.eventListener
.remove(callbackObject);

Contribution

Install packages

npm install

Rollup CLI

npm install -g rollup

Build

rollup -c

Development

rollup -c -w