Basic
Advance
- Adding dynamic field
- Changing tooltip position
- Complex form
- Enabling the submit button all the time
- Enabling validator
- Hiding messages
- Hiding success class
- Overriding default options
- Showing icons in custom area
- Showing only one message each time
- Showing messages in custom area
- Showing required icon for the mandatory fields
- Showing valid message
- Using Ajax to submit the form
Integrating with server side
These examples shows how to integrate BootstrapValidator with the server side:
Compatibility
In order to make BootstrapValidator work together with other plugin, you should follow two rules below:
-
Don't exclude the field if the plugin changes the field visibility
Some plugins hide your field and create new elements to change how the field looks like. By default, the hidden, invisible fields will not be validated. Therefore, you need to set
excluded: ':disabled'
. See the excluded option for more information.Example: Bootstrap Button
-
Revalidate the field if the plugin changes its value dynamically:
Most plugins trigger an event after changing the field value. By using this kind of event handler, you need to ask BootstrapValidator to revalidate the field.
$(field)
.nameOfPlugin(pluginOptions)
.on(pluginChangedEvent, function() {
$(form)
.data('bootstrapValidator') // Get the validator instance
.revalidateField(field); // Revalidate it
// It is equivalent to use
$(form).bootstrapValidator('revalidateField', field);
});
Look at the revalidateField()
method for more details.
Example: Chosen
These examples show how you can use BootstrapValidator with other Javascript plugins.