|
|
@@ -65,60 +65,85 @@ Call the plugin to validate the form as following:
|
|
|
```javascript
|
|
|
$(document).ready(function() {
|
|
|
$(<form Selector>).bootstrapValidator({
|
|
|
- // The default error message for all fields
|
|
|
- // You can specify the error message for any fields
|
|
|
message: 'This value is not valid',
|
|
|
-
|
|
|
- // The number of grid columns
|
|
|
- // Change it if you use custom grid with different number of columns
|
|
|
columns: 12,
|
|
|
-
|
|
|
- // Shows ok/error/validating icons based on the field validity.
|
|
|
- // This feature requires Bootstrap v3.1.0 or later (http://getbootstrap.com/css/#forms-control-validation).
|
|
|
- // Since Bootstrap doesn't provide any methods to know its version, this option cannot be on/off automatically.
|
|
|
- // In other word, to use this feature you have to upgrade your Bootstrap to v3.1.0 or later.
|
|
|
- feedbackIcons: false,
|
|
|
-
|
|
|
- // The submit buttons selector
|
|
|
- // These buttons will be disabled when the form input are invalid
|
|
|
- submitButtons: ...,
|
|
|
-
|
|
|
- // Custom submit handler
|
|
|
- // The handler has three arguments:
|
|
|
- // - validator is the instance of BootstrapValidator
|
|
|
- // - form is jQuery object representing the current form
|
|
|
- // - submitButton is jQuery object representing the submit button which is clicked
|
|
|
- // By default, submitHandler is null
|
|
|
- submitHandler: function(validator, form, submitButton) {
|
|
|
- },
|
|
|
-
|
|
|
- // Live validating. Can be one of 3 values:
|
|
|
- // - enabled: The plugin validates fields as soon as they are changed
|
|
|
- // - disabled: Disable the live validating.
|
|
|
- // The error messages are only shown after the form is submitted
|
|
|
- // - submitted: The live validating is enabled after the form is submitted
|
|
|
+ feedbackIcons: null,
|
|
|
+ submitButtons: 'button[type="submit"]',
|
|
|
+ submitHandler: null,
|
|
|
live: 'enabled',
|
|
|
+ fields: ...
|
|
|
+ });
|
|
|
+});
|
|
|
+```
|
|
|
+
|
|
|
+```message```: The default error message for all fields. You can specify the error message for any fields
|
|
|
+
|
|
|
+```columns```: The number of grid columns. Change it if you use custom grid with different number of columns
|
|
|
+
|
|
|
+```feedbackIcons```: Show valid/invalid/validating icons based on the field validity.
|
|
|
+
|
|
|
+This feature requires Bootstrap v3.1.0 or later (http://getbootstrap.com/css/#forms-control-validation).
|
|
|
+Since Bootstrap doesn't provide any methods to know its version, this option cannot be on/off automatically.
|
|
|
+In other word, to use this feature you have to upgrade your Bootstrap to v3.1.0 or later.
|
|
|
|
|
|
- // The fields which need to be validated
|
|
|
- fields: {
|
|
|
+It supports [Glyphicons](http://getbootstrap.com/components/#glyphicons) (included in Bootstrap):
|
|
|
+
|
|
|
+```javascript
|
|
|
+feedbackIcons: {
|
|
|
+ valid: 'glyphicon glyphicon-ok',
|
|
|
+ invalid: 'glyphicon glyphicon-remove',
|
|
|
+ validating: 'glyphicon glyphicon-refresh'
|
|
|
+}
|
|
|
+```
|
|
|
+
|
|
|
+and [FontAwesome](http://fontawesome.io/icons) icons (don't forget to insert FontAwesome CSS in your ```head```):
|
|
|
+
|
|
|
+```javascript
|
|
|
+feedbackIcons: {
|
|
|
+ valid: 'fa fa-check',
|
|
|
+ invalid: 'fa fa-times',
|
|
|
+ validating: 'fa fa-refresh'
|
|
|
+}
|
|
|
+```
|
|
|
+
|
|
|
+```submitButtons```: The submit buttons selector. These buttons will be disabled when the form input are invalid
|
|
|
+
|
|
|
+```submitHandler```: Custom submit handler.
|
|
|
+
|
|
|
+The handler has three arguments:
|
|
|
+
|
|
|
+- ```validator``` is the instance of BootstrapValidator
|
|
|
+- ```form``` is jQuery object representing the current form
|
|
|
+- ```submitButton``` is jQuery object representing the submit button which is clicked
|
|
|
+
|
|
|
+By default, ```submitHandler``` is ```null```
|
|
|
+
|
|
|
+```live```: Live validating. Can be one of 3 values:
|
|
|
+
|
|
|
+- ```enabled```: The plugin validates fields as soon as they are changed
|
|
|
+- ```disabled```: Disable the live validating. The error messages are only shown after the form is submitted
|
|
|
+- ```submitted```: The live validating is enabled after the form is submitted
|
|
|
+
|
|
|
+```fields```: The fields which need to be validated
|
|
|
+
|
|
|
+```javascript
|
|
|
+fields: {
|
|
|
+ ...
|
|
|
+ // The field name
|
|
|
+ // It is value of the name attribute
|
|
|
+ <fieldName>: {
|
|
|
+ // The default error message for this field
|
|
|
+ message: ...,
|
|
|
+
|
|
|
+ // Array of validators
|
|
|
+ validators: {
|
|
|
...
|
|
|
- // The field name
|
|
|
- // It is value of the name attribute
|
|
|
- <fieldName>: {
|
|
|
- // The default error message for this field
|
|
|
- message: ...,
|
|
|
-
|
|
|
- // Array of validators
|
|
|
- validators: {
|
|
|
- ...
|
|
|
- <validatorName>: <validatorOptions>
|
|
|
- ...
|
|
|
- }
|
|
|
- }
|
|
|
+ <validatorName>: <validatorOptions>
|
|
|
...
|
|
|
}
|
|
|
- });
|
|
|
-});
|
|
|
+ }
|
|
|
+ ...
|
|
|
+}
|
|
|
```
|
|
|
|
|
|
The ```<validatorName>``` can be the name of the built-in validator which are described in the [Validators](#validators) section
|
nghuuphuoc