9 Highly Useful Form & Validation jQuery Plugins

It’s been another very productive year for web designers and developers this past 2011, which was brimming with jQuery plugins. And according to my observation, many of them are content sliders.

So to start off this year, we’ll focus on another particular set of plugins that have made 2011 a bit easier for web developers. This is my list of the Most Helpful New Form & Validation Plugins of 2011, in random order:

1. Recurly.js – This plugin allows you to create secure, PCI compliant transaction forms with fully customizable CSS.

Demo

2. Ideal Forms – This deceptively small framework is used to build powerful and beautiful online forms. It is highly customizable because it’s all CSS, and also supports the latest browser versions.

Demo

3. In-Field Labels – This plugin turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focused and disappear when text entry begins. Clearing a field and leaving brings back the label into view. It supports old browsers (i.e. IE6 and Firefox 2+) though it is worth noting that IE6 requires a background-color be set on the label to match the field background. Also, there’s a minor issue about the autocomplete function, which I suggest you read about in their documentation.

Download1 (@Github), Download2 (.zip)

4. Sisyphus – Just like Gmail, this plugin periodically saves form entries while you’re composing messages. So when your visitors accidentally close the tab or browser while filling out your form, all the changes they made are restored once it’s reopened.

Demo, Download1 (.zip), Download2 (.tar)

5. Smart Validate – This jQuery credit card validation plugin ensures that the user has entered a valid credit card number before making the actual transaction. It supports all major credit cards (American Express, Mastercard, Visa, Discover, Diners Club) but it can also easily be extended to support other credit cards as well.

Demo, Download (.zip)

6. MotionCAPTCHA – Now this is a totally different approach in verifying human interaction. jQuery CAPTCHA is a plugin that requires users to sketch the shape they see in the canvas instead of typing a series of random text in order to submit a form.

Demo

7. Power PWChecker – This is a free jQuery plugin that helps users determine the strength of their password. This plugin can be integrated seamlessly with any online form and it also gives users hints on creating more secure passwords.

Demo

8. DropKick – This extremely light plugin lets you easily create custom dropdown menus. It also degrades gracefully for visitors on older browsers. It even works on IE7 and 8!