Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
jQuery inputValidation plugin (not finished yet)
(function($) {
$.fn.inputValidation = function(method) {
var methods = {
init : function(options) {
this.inputValidation.settings = $.extend({}, this.inputValidation.errorMessage, options);
return this.each(function() {
var $element = $(this), // reference to the jQuery version of the current DOM element
element = this; // reference to the actual DOM element
});
},
// isRequired method to check if the input is not empty.
isRequired: function(message) {
console.log('message: ' + message);
if(!message || message === undefined) {
message = this.inputValidation.errorMessage.required;
console.log('message: ' + message);
}
$(this).focus(function() {
helpers.removeError($(this));
helpers.removeError($(this));
});
$(this).blur( function() {
if($(this).val() === '') {
$(this).addClass('error');
$(this).after('<p class="error error_message">'+message+'</p>').fadeIn('slow');
}
});
},
// isNumber method to check if it is an number in the input field
isNumber: function(message) {
/** Default message **/
if(!message || message === undefined) {
message = this.inputValidation.errorMessage.number;
console.log('message: ' + message);
}
$(this).focus(function() {
helpers.removeError($(this));
});
$(this).blur( function() {
var inputVal = $(this).val();
if(inputVal && !$.isNumeric(inputVal)) {
$(this).addClass('error');
$(this).after('<p class="error error_message">'+message+'</p>').fadeIn('slow');
} else {
helpers.valid($(this));
}
});
},
};
var helpers = {
removeError: function(element) {
console.log('element: ', element);
// Remove error class from input and remove error message if input is focused
element.removeClass('error');
element.removeClass('valid');
element.next().remove();
},
valid: function(element) {
console.log('element: ', element);
// Remove error class from input and remove error message if input is focused
element.addClass('valid');
},
};
if (methods[method]) {
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
} else if (typeof method === 'object' || !method) {
return methods.init.apply(this, arguments);
} else {
$.error( 'Method "' + method + '" does not exist in inputValidation plugin!');
}
};
$.fn.inputValidation.errorMessage = {
foo: 'googlasdnklansdl;as;ldle',
required: 'Dit veld is een verplicht',
number: 'Dit zij geen cijfers',
};
$.fn.inputValidation.settings = {};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.