Minimal Form Input Validation Plugin with jQuery - validate.js
File Size: | 6.87 KB |
---|---|
Views Total: | 3300 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

validate.js is a small jQuery client-side form validation plugin that utilizes RegEx patterns to add validation with custom error messages to existing form inputs.
How to use it:
1. Load jQuery library and the jQuery validate.js at the end of the web page.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="jquery.validate.js"></script>
2. Add validators to your form inputs via data-*
attributes as follows.
<input type="text" data-require="email"> <input type="text" data-require="date"> <input type="text" data-require="phone"> ...
3. Call the plugin on the form element to enable the validators.
$('form').validate();
4. Default settings.
type : "standart", // or ajax usesweetalerts : true, success_texth : "Thank you!", success_textp : "Your message has been sent!", style_user : "", style_base : "<style>.input_error{color:red!important;}</style>", class_error : "input_error", validators : { reg : { email : /^([a-z0-9_\.\-\+]+)@([\da-z\.\-]+)\.([a-z\.]{2,6})$/i, url : /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/, phone : /^(\d|\+\d ?)?( )?\(?\d{3}\)?(-| )?\d{3}(-| )?\d{2}(-| )?\d{2}$/, date : /^(\d{1,2})\/(\d{1,2})\/(\d{4})$/, en : /^[A-Za-z]+$/ }, text : { email : "Please enter a valid email", url : "For example: http://jQueryscript.net", phone : "Please enter a valid phone number", date : "dd/mm/yyyy", en : "English only" } }, callbacks : { // do something... }
This awesome jQuery plugin is developed by Tom-Lo. For more Advanced Usages, please check the demo page or visit the official website.