Pages

Sunday, March 6, 2011

jQuery: Lightweight Validation Plugin

Here is a validation plugin that I've been working on in my spare time and while also at my day job. I asked my employer, Catalyst, if I could release this as open source and they told me to post it.

Brief documentation:

//Initialize: $('.elementsToValidate').validateHandle();//Add rules if they aren't in the default rule set ($.fn.validateHandle.defaults.defaultRule):$('#specificElement').addRule({ "rule": /^[0-9]{1,20}$/, "message": "Can only be digits foo!" });//Validate:$('.elementsToValidate').validate();

The reason I created this plugin is because it seems like the validation plugins that are out there are pretty good but they're all quite large and we didn't need all the frills so I created this lighter weight validation that does a great job.

Please comment if you found the plugin useful or if you think there need to be improvements. Give me 5 stars on the jQuery plugins page here if you enjoyed my plugin. Thanks!

5 comments:

Hello!How can i create a rule so that the field is required ?I tried:$("my_field_name").addRule({ "rule": /^.{1,}$/ , "message": "This field is required." });...but the user can put one or several blank character and valid the form...

@Frans: I have fixed the issue on the demo page. Everything seems to be working on FF 3.6.15 now.

@Anonymous: The . character matches any character when used in a regex. If you refactor your regex I believe you will see the validation you are looking for. Also there is a readme section at the top of the uncompressed jquery.validateHandle.js file that would be helpful.

Here are some good regex tools that I use:http://regexpal.com/http://regex.larsolavtorvik.com/

@Peter: Please email me at samonstuffblog@gmail.com. I do not have a mac to test on though. So it might be something that you have to diagnose and fix in the plugin yourself. I do not see any issues with the plugin in Safari and Chrome.