Minimal Form Input Validation Plugin with jQuery - validate.js
| File Size: | 6.87 KB |
|---|---|
| Views Total: | 3336 |
| 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.











