Bootstrapvalidator-based data validation

Do web development, often need to use to form verification, the author himself began to write a variety of verification, recently contacted Bootstrapvalidator, feel very useful, friendly interface, easy to use, and bootstrap perfect compatibility, called the front-end data validation artifact.
So, today, let's look at how to use Bootstrapvalidator to do form verification!
First, use Bootstrapvalidator to download the package from the GitHub bootstrapvalidator project page.

style sheet (CSS) files:
Bootstrap.min.css
BootstrapValidator.min.css
js script file:
Jquery-1.10.2.min.js
Bootstrap.min.js

The login interface is as follows:

The login interface code is as follows:

PS: The author uses the Botstrap framework to write the interface, if you are not familiar with the Bootstrap framework, then you can read the author's previous article "Web Front-end framework learning-bootstrap" to understand Bootstrap.

Import bootstrapvalidator CSS files, JS files, you need to write a jquery script for data validation. Here is a simple jquery data validation script written by the author, which can be read with reference to the documentation comments.

After adding the validation, let's look at:
Here the author of the user name is set to use email substitution, enter the wrong email address, data validation does not pass, CSS control input box is displayed in red, you can not click the login button.

Enter the correct email address, enter the wrong password, data validation does not pass, the CSS control input box is displayed in red, you can not click the login button.

When the user name, password all entered correctly, the data validation through, the CSS control input box is displayed as green, you can click the login button.

In the age of Internet, learning becomes more convenient and information is available at your fingertips.
1. Bootstrapvalidator on GitHub's homepage
2. Bootstrapvalidator tutorial based on jquery,bootstrap data validation plugin
3. JS Component series--form form verification artifact: Bootstrapvalidator

Bootstrapvalidator-based data validation