Easy Form Validation Plugin For Bootstrap 4 - jQuery s-validatejs
File Size: | 16.1 KB |
---|---|
Views Total: | 16781 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
s-validatejs is a super tiny jQuery plugin that provides the client-side form field validation for the latest Bootstrap 4 framework.
Validation rules supported:
- Email address.
- Password.
- Required field.
- Min number of required chars.
How to use it:
1. Import the jQuery s-validatejs plugin's script into your Bootstrap project.
<!-- Bootstrap files --> <link rel="stylesheet" href="/path/to/bootstrap.min.css"> <script src="/path/to/query.min.js"></script> <script src="/path/to/tether.min.js"></script> <script src="/path/to/bootstrap.min.js"></script> <!-- jQuery s-validatejs --> <script src="svd.js"></script>
2. Create a message container to display the success message when all the form fields are valid.
<div id="message"> <div class="alert alert-success" role="alert"> <strong>Well done!</strong> You send message! </div> </div> <!-- jQuery s-validatejs --> <script src="svd.js"></script>
#message{ display: none; }
3. Setup the form validation plugin and customize the error messages.
var settings = { // set #id for validation email emailID: '#inputEmail', // set text for validation email ErrorTextEmail: 'Enter valid email', // set #id for validation password passwordID: '#inputPassword', // set text for validation password ErrorTextPassword: 'Must be 7-20 characters long.', // set value required chars for validation password MinCharsPass: '7', // set #id for validation custom Custom: '#inputCustom', // set text for validation password ErrorTextCustom: 'Must be 5-20 characters long custom.', // set value required chars for validation custom form MinCharsCustom: '5' }
Change log:
2017-08-06
- JS update
This awesome jQuery plugin is developed by SergeIpatyev. For more Advanced Usages, please check the demo page or visit the official website.