Bootstrap Validator

Bootstrap Validator is a jQuery plugin that adds automatic, HTML5-attribute-driven form validation to Bootstrap 3 forms. Created by Cina Saffary (GitHub user 1000hz), the plugin is designed to give users a non-naggy experience: errors appear unobtrusively and disappear as soon as they are fixed. It is open-source under the MIT license and can be installed via CDNJS, Bower, npm, or by cloning the repository from GitHub.

What is Bootstrap Validator?

Bootstrap Validator is a client-side form validation plugin built specifically for Bootstrap 3 and jQuery. It takes an HTML form with validation rules expressed as standard HTML5 attributes (e.g., required, type, pattern) or via data-api attributes, and it produces real-time error messages and disabled submission until the form is valid. The project is hosted on GitHub, has approximately 2,352 stars, and is maintained by Cina Saffary.

Key Features

• HTML5 attribute configuration — validation rules are set directly in the markup with standard HTML5 attributes plus data-api hooks, so no extra JavaScript is needed for basic cases.
• Unobtrusive error reporting — the plugin informs users of errors without nagging; messages show on interaction and clear immediately when the error is resolved.
• Submit blocking — the form's submit button stays disabled until all required fields pass validation, preventing accidental submission of invalid data.
• Customizable error messages — developers can override the default message text per field, tailoring the language and tone to their application.
• Custom validator functions — for business-specific rules, you can supply your own validator functions that run alongside the built-in HTML5 checks.
• AJAX validation — the plugin supports validating a field's value asynchronously, which is useful for checking uniqueness or server-side constraints.
• Multiple installation routes — available via CDNJS, Bower, npm, or a git clone from the GitHub repository.

Who should use Bootstrap Validator?

• Bootstrap 3 developers — anyone building forms on Bootstrap 3 who wants validation without writing custom JavaScript; just add HTML5 attributes and initialize the plugin.
• Front-end prototypers — teams that need working validated forms quickly for demos or MVPs, since the plugin is minimal and configurable.
• Maintainers of legacy Bootstrap 3 sites — developers upgrading an existing Bootstrap 3 codebase can add validation with almost no markup changes.

What can you do with Bootstrap Validator?

• Web developers: build login, signup, and contact forms that validate email formats, required fields, and custom rules automatically.
• UX designers: ensure error states are visible and clear in the UI, because the plugin shows and hides messages without page reloads.
• API-driven applications: use AJAX validation to check usernames or emails against a backend before the user submits the full form.

How does Bootstrap Validator work?

After including jQuery, Bootstrap 3, and the validator script, you apply the plugin to a form via the data-api or by calling it programmatically. The plugin then parses the HTML5 and data attributes, validates on relevant events (such as input blur or form submit), toggles error messages, and keeps the submit button disabled until all checks pass. Full usage details are in the project documentation hosted at 1000hz.github.io/bootstrap-validator.

FAQ

Is Bootstrap Validator free?

Yes, Bootstrap Validator is open-source and released under the MIT license. You can use, modify, and distribute it freely in personal and commercial projects without any cost.

Does Bootstrap Validator work with Bootstrap 4 or 5?

No. The plugin is written specifically for Bootstrap 3's markup and JavaScript. The project was last updated in 2016 and does not support Bootstrap 4 or 5; you would need a different validation plugin for those versions.

Can I validate a field against the server without submitting?

Yes, the plugin includes AJAX validation support, letting you write a custom validator that checks a value asynchronously and returns a pass/fail result, which is ideal for checking data uniqueness.

How do I install Bootstrap Validator?

You can load it from the CDNJS CDN, install it with Bower using bower install bootstrap-validator, install it with npm using npm install bootstrap-validator, or clone the repository to your project.