Form validation. Two words that send shivers down any developers back. Building a form? No problem. What about validating it? No comment.
What we have for you today is a selection of robust, reliable and easy-to-use form validation jQuery plugins and libraries that will make your life a heck of a lot easier. Here they are:
Parsley.js
Parsley.js is a lightweight and feature-rich library that instead of validating forms with Javascript, it uses data attributes embedded in the DOM to achieve the same function. The surprisingly easy to configure plugin also allows you to override almost every default behavior so that it will fit in with your form requirements.
quickValidation.js
quickValidation.js works much like Parsley above. It doesn’t defines the rules in the Javascript, instead they are assigned directly by using a data-validate
attribute in the input tag. It will string together rules like required,number,range=0-99
, then you add the .quickValidate
class, add a data-name
attribute to name your field for errors, and you’re good to go.
jQuery Ketchup Plugin
Ketchup is a lightweight (3.4KB minified) plugin that comes packaged with 18 basic validations, but does allow you to easily write your own validations and overwrite any default behaviours.
By default the plugin will check the data-validate
attribute of a form field to see if it can find any matching validations. The default indicator for validations is validate()
, all validations go in there and are separated by a comma. Validations can also have arguments (also separated by a comma).
jQuery Validation Plugin
jQuery Validation is a ‘drop-in’ plugin that makes clientside form validation very easy. It comes packaged with a useful set of validation methods, while also providing an API to easily write your own.
All that is needed to get started with this plugin is single line of jQuery to select the form and apply the plugin, plus a few annotations on each element to specify the validation rules.
IV.js – Javascript Input Validation
IV.js is a jQuery library that provides an intuitive way to work with validation filters and processing of user inputs. In order to work with IV.js, you need to add the IValidate class to the form.
BootstrapValidator
BootstrapValidator is a jQuery plugin for validating Bootstrap forms.
Guardian
Guardian is a flexible and easy to extend all-purpose form validation jQuery plugin.
Validatr
Validatr uses HTML5 input attributes to perform validation, with support for color
, date
, email
, number
and range
. The input types text
, checkbox
, radio
…. are supported, but do not require the same level of validation.
Where possible, Validatr will use native validation, using Modernizr to test for support. If an input type is not supported it will use it’s own ruleset to supplement native validation. In both cases case, the validation message is shown.
Formance.js
Formance.js is a library for formatting and validating form fields, based on and inspired by Stripe’s jQuery.payment library.
Fields.js
Fields.js comes with an MIT license and offers an abstract way of interacting with fields.
jQuery Validate
jQuery Validate is a jQuery plugin for that helps you accomplish easy and quick form validation using data attributes.
jQuery Form Validate
jQuery Form Validate is another jQuery plugin that lets you validate your HTML forms by taking validation rules from HTML 5 data attributes applied to each input.
One-Validation
One-Validation is a collection of regular expressions for general validation purposes. In order to validate, it splits up the regexes into semantic parts of the pattern.
Validarium
Validarium is a simple and straight-forward jQuery validation plugin based on jQuery Validate.
Validate Barebones Validation
Validate Barebones Validation, as is obvious from the name itself, is a configurable and extendable barebones jQuery validation plugin.
nextVal
nextVal is a client-side form validation plugin for jQuery.
jQuery Super Labels Plugin
The jQuery Super Labels Plugin makes the label slide across the field when gaining focus and fade out when a value is entered.
Related Posts
- The 50 Most Useful jQuery Plugins for Frontend Development
- Despite Its Critics, jQuery Forges Ahead
- 12 Free Modal Window Libraries & Plugins For Your Site
- 10 Free Open-Source Date Picker Plugins
- 9 Free Floating Form Label jQuery & JavaScript Plugins
- 18 Free jQuery Image Gallery & Lightbox Plugins
- 10 Useful Components, Libraries & Tools for React.js
- 10 Free WordPress Plugins for Adding jQuery Effects to Your Site
- 10 Popular Web Typography Frameworks & Libraries
- Top 50 Free JavaScript Plugins & Libraries