Skip to content

pvshum/ractive-validate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

Ractive.js form data model validation.

Based off initial investigation into existing libraries like Ractive Validator and Foundation Abide

The Problem

DOM manipulation style libraries (Abide) work terribly with reactive templating, and cause headaches. Data validation is the better approach, and aligns well with reactive templating approach.

The Solution

When you define your widget in JavaScript, in the constructor you do this: Create instance of RactiveValidate, passing the reactive widget instance (to get data from using Ractive Keypaths) AND a validation definition.

self.validation = new RactiveValidate(self.ractive, {
    'fieldKeypath': {
        required: 'Please enter the account name',
        alpha: 'Please enter a valid name',
        someCustomRuleIMadeUp: 'You obey this rule!',
        minlength: {
            param: 1,
            message: 'Please enter minimum of 1 characters'
        },
        maxlength: {
        	param: 5,
        	message: 'Please enter maximum of 5 characters'
        }
    }
});

Allow for custom validation rules for this specific widget.

_.extend(self.validation.patterns, {
    someCustomRuleIMadeUp: function (data) {
        // Your code here
        return someBooleanResult;
    }
});

About

Ractive.js form data model validation.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published