jQuery wrapper of Parsley.js

In a project, I have a lot of HTML forms without validation and I want to add a front end validation, in a quick way. I start looking for a library and I met Parsley.js. It's a good library, but if I decided to use it I would have to modify all the forms in my application.

So there is where this code is born. It's for automatically binding a set of rules you define to a form.

```
//Only basic types and validators.
$.fn.parsley.mapping = {
//Types
'alphanum': {'parsley-type': 'alphanum'},
'email': {'parsley-type': 'email'},
'url': {'parsley-type': 'url'},
'number': {'parsley-type': 'number'},
'digits': {'parsley-type': 'digits'},
'dateIso': {'parsley-type': 'dateIso'},
'phone': {'parsley-type': 'phone'},

//Validators
'required': {'parsley-required': 'true'},
'notblank': {'parsley-notblank': 'true'},
'minlength': {'parsley-minlength': '?'},
'maxlength': {'parsley-maxlength': '?'},
'min': {'parsley-min': '?'},
'max': {'parsley-max': '?'}
}

//Only inputs and textareas
$.fn.parsley.fields = 'input:visible, textarea:visible';

!function ($) {
$.fn.generalValidation = function( validationRules ) {

var name, validations, validationName, validationValue, att, key, value
, form = $( this )
, addValidations = function( validationRules ){
if(validationRules === undefined){
console.log('Error!!! You need to add the validation rules parameter');
validationRules = {};
}
$( form ).find( $.fn.parsley.fields ).each(function(){
name = $( this ).attr('name');
validations = validationRules[name];

if(validations == undefined) return true;

for(validation in validations){
validationName = validations[validation];
validationValue = '';
if(validationName.indexOf(':') !== -1){
validationValue = validationName.substr(validationName.indexOf(':')+1, validationName.length);
validationName = validationName.substr(0, validationName.indexOf(':'));
}

att = $.fn.parsley.mapping[validationName];
if(att !== undefined){
$.map(att, function (v

From a once over:

-
The following is not DRY at all, you have to find a way to not do this:

//Types
'alphanum': {        'parsley-type': 'alphanum'    },
'email': {        'parsley-type': 'email'    },
'url': {        'parsley-type': 'url'    },
'number': {        'parsley-type': 'number'    },
'digits': {        'parsley-type': 'digits'    },
'dateIso': {        'parsley-type': 'dateIso'    },
'phone': {        'parsley-type': 'phone'    },

I am pretty sure you can throw all that way by changing to the below statement:

att = $.fn.parsley.mapping[validationName] || {  'parsley-type': validationName  };

• Also, $.fn.parsley.mapping could use some aligning to look better

• You are calling $.map without capturing the array it returns, perhaps you meant to use forEach ? Also, it seems that your code will not work correctly if there is more than 1 property in parsley.mapping.You keep assign to the same key and value.

-
Your var statement is too messy:

var name, validations, validationName, validationValue, att, key, value, form = $(this),
    addValidations = function (validationRules) {

• Comparisons with undefined should be either with === or by doing a falsey check so use either if(validations === undefined) or if(!validations)

• There is no var validation for for(validation in validations){

• There are plenty of comma and semicolon problems, you should use jshint to find & solve them

All in all, I like the value of your wrapper, but I think it needs some more polishing.

StackExchange Code Review Q#41703, answer score: 3