#125: Fix the issue that new checkbox is not validated (dynamic.html)

demo/dynamic3.html

@@ -105,6 +105,9 @@
 <script type="text/javascript">
     $(document).ready(function() {
         $('#shippingForm')
+            .on('init.form.bv', function(e, data) {
+                //console.log(data);
+            })
             .bootstrapValidator({
                 message: 'This value is not valid',
                 feedbackIcons: {
@@ -147,51 +150,49 @@
                     }
                 }
             })
-            .find('input[type="checkbox"][name="receiver"]')
-                .on('change', function() {
-                    var sameAsSender   = $(this).is(':checked'),
-                        $receiverPhone = $('#shippingForm').find('input[name="receiverPhone"]').eq(0),
-                        $receiverCity  = $('#shippingForm').find('input[name="receiverCity"]').eq(0);
-
-                    if (sameAsSender) {
-                        $('#receiverInfo').hide();
+            .on('change', 'input[type="checkbox"][name="receiver"]', function() {
+                var sameAsSender   = $(this).is(':checked'),
+                    $receiverPhone = $('#shippingForm').find('input[name="receiverPhone"]').eq(0),
+                    $receiverCity  = $('#shippingForm').find('input[name="receiverCity"]').eq(0);
 
-                        $('#shippingForm')
-                            // Use removeField() method
-                            .bootstrapValidator('removeField', 'receiverName')
-                            .bootstrapValidator('removeField', 'receiverAddress')
-                            // Use removeFieldElement() method
-                            .bootstrapValidator('removeFieldElement', $receiverPhone)
-                            .bootstrapValidator('removeFieldElement', $receiverCity);
+                if (sameAsSender) {
+                    $('#receiverInfo').hide();
 
-                    } else {
-                        $('#receiverInfo').show();
+                    $('#shippingForm')
+                        // Use removeField() method
+                        .bootstrapValidator('removeField', 'receiverName')
+                        .bootstrapValidator('removeField', 'receiverAddress')
+                        // Use removeFieldElement() method
+                        .bootstrapValidator('removeFieldElement', $receiverPhone)
+                        .bootstrapValidator('removeFieldElement', $receiverCity);
+                } else {
+                    $('#receiverInfo').show();
 
-                        $('#shippingForm')
-                            // Use addField() method
-                            .bootstrapValidator('addField', 'receiverName', {
-                                validators: {
-                                    notEmpty: {
-                                        message: 'The name is required'
-                                    }
+                    $('#shippingForm')
+                        // Use addField() method
+                        .bootstrapValidator('addField', 'receiverName', {
+                            validators: {
+                                notEmpty: {
+                                    message: 'The name is required'
                                 }
-                            })
-                            .bootstrapValidator('addField', 'receiverAddress')      // The options are automatically parsed from HTML attributes
-                            // Use addFieldElement() method
-                            .bootstrapValidator('addFieldElement', $receiverPhone, {
-                                message: 'The phone number is not valid',
-                                validators: {
-                                    notEmpty: {
-                                        message: 'The phone number is required'
-                                    },
-                                    digits: {
-                                        message: 'The value can contain only digits'
-                                    }
+                            }
+                        })
+                        .bootstrapValidator('addField', 'receiverAddress')      // The options are automatically parsed from HTML attributes
+                        // Use addFieldElement() method
+                        .bootstrapValidator('addFieldElement', $receiverPhone, {
+                            message: 'The phone number is not valid',
+                            validators: {
+                                notEmpty: {
+                                    message: 'The phone number is required'
+                                },
+                                digits: {
+                                    message: 'The value can contain only digits'
                                 }
-                            })
-                            .bootstrapValidator('addFieldElement', $receiverCity);  // The options are automatically parsed from HTML attributes
-                    }
-                });
+                            }
+                        })
+                        .bootstrapValidator('addFieldElement', $receiverCity);  // The options are automatically parsed from HTML attributes
+                }
+            });
     });
 </script>
 </body>

dist/js/bootstrapValidator.js

@@ -186,7 +186,8 @@
                             return;
                         }
 
-                        var opts = that._parseOptions($field);
+                        var field = $field.attr('name') || $field.attr('data-bv-field'),
+                            opts  = that._parseOptions($field);
                         if (opts) {
                             $field.attr('data-bv-field', field);
                             options.fields[field] = $.extend({}, opts, options.fields[field]);
@@ -198,7 +199,9 @@
                 this._initField(field);
             }
 
-            this.$form.trigger($.Event('init.form.bv'));
+            this.$form.trigger($.Event('init.form.bv'), {
+                options: this.options
+            });
         },
 
         /**
@@ -862,7 +865,7 @@
                 type, status, validatorName,
                 n, i;
             for (field in this.options.fields) {
-                if (this.options.fields[field] == null || !this.options.fields[field]['enabled']) {
+                if (this.options.fields[field] == null || this.options.fields[field]['enabled'] == false) {
                     continue;
                 }
 
@@ -1011,6 +1014,7 @@
                 type   = fields.attr('type'),
                 n      = (('radio' == type) || ('checkbox' == type)) ? 1 : fields.length;
 
+            fields.attr('data-bv-field', field);
             for (var i = 0; i < n; i++) {
                 this.addFieldElement($(fields[i]), options);
             }
@@ -1046,9 +1050,9 @@
          * @returns {BootstrapValidator}
          */
         addFieldElement: function($field, options) {
-            var field = $field.attr('name');
-
-            delete this._cacheFields[field];
+            var field = $field.attr('data-bv-field') || $field.attr('name'),
+                type  = $field.attr('type');
+            $field.attr('data-bv-field', field);
 
             // Try to parse the options from HTML attributes
             var opts = this._parseOptions($field);
@@ -1057,7 +1061,8 @@
             this.options.fields[field] = $.extend(true, this.options.fields[field], opts);
 
             // Init the element
-            this._initFieldElement($field);
+            delete this._cacheFields[field];
+            ('checkbox' == type || 'radio' == type) ? this._initField(field) : this._initFieldElement($field);
 
             this.disableSubmitButtons(false);
 
@@ -1078,9 +1083,11 @@
          * @returns {BootstrapValidator}
          */
         removeFieldElement: function($field) {
-            var field = $field.attr('name') || $field.attr('data-bv-field'),
+            var field = $field.attr('data-bv-field') || $field.attr('name'),
                 type  = $field.attr('type');
 
+            $field.attr('data-bv-field', field);
+
             // Update the cache
             var index = this._cacheFields[field].index($field);
             (index == -1) ? (delete this._cacheFields[field]) : this._cacheFields[field].splice(index, 1);
@@ -1093,8 +1100,8 @@
 
             if (this._cacheFields[field].length == 0) {
                 // There is no field with the same name
-                delete this.options.fields[field];
-                delete this._cacheFields[field];
+                //delete this.options.fields[field];
+                //delete this._cacheFields[field];
             } else if ('checkbox' == type || 'radio' == type) {
                 this._initField(field);
             }

src/js/bootstrapValidator.js

@@ -185,7 +185,8 @@
                             return;
                         }
 
-                        var opts = that._parseOptions($field);
+                        var field = $field.attr('name') || $field.attr('data-bv-field'),
+                            opts  = that._parseOptions($field);
                         if (opts) {
                             $field.attr('data-bv-field', field);
                             options.fields[field] = $.extend({}, opts, options.fields[field]);
@@ -197,7 +198,9 @@
                 this._initField(field);
             }
 
-            this.$form.trigger($.Event('init.form.bv'));
+            this.$form.trigger($.Event('init.form.bv'), {
+                options: this.options
+            });
         },
 
         /**
@@ -861,7 +864,7 @@
                 type, status, validatorName,
                 n, i;
             for (field in this.options.fields) {
-                if (this.options.fields[field] == null || !this.options.fields[field]['enabled']) {
+                if (this.options.fields[field] == null || this.options.fields[field]['enabled'] == false) {
                     continue;
                 }
 
@@ -1010,6 +1013,7 @@
                 type   = fields.attr('type'),
                 n      = (('radio' == type) || ('checkbox' == type)) ? 1 : fields.length;
 
+            fields.attr('data-bv-field', field);
             for (var i = 0; i < n; i++) {
                 this.addFieldElement($(fields[i]), options);
             }
@@ -1045,9 +1049,9 @@
          * @returns {BootstrapValidator}
          */
         addFieldElement: function($field, options) {
-            var field = $field.attr('name');
-
-            delete this._cacheFields[field];
+            var field = $field.attr('data-bv-field') || $field.attr('name'),
+                type  = $field.attr('type');
+            $field.attr('data-bv-field', field);
 
             // Try to parse the options from HTML attributes
             var opts = this._parseOptions($field);
@@ -1056,7 +1060,8 @@
             this.options.fields[field] = $.extend(true, this.options.fields[field], opts);
 
             // Init the element
-            this._initFieldElement($field);
+            delete this._cacheFields[field];
+            ('checkbox' == type || 'radio' == type) ? this._initField(field) : this._initFieldElement($field);
 
             this.disableSubmitButtons(false);
 
@@ -1077,9 +1082,11 @@
          * @returns {BootstrapValidator}
          */
         removeFieldElement: function($field) {
-            var field = $field.attr('name') || $field.attr('data-bv-field'),
+            var field = $field.attr('data-bv-field') || $field.attr('name'),
                 type  = $field.attr('type');
 
+            $field.attr('data-bv-field', field);
+
             // Update the cache
             var index = this._cacheFields[field].index($field);
             (index == -1) ? (delete this._cacheFields[field]) : this._cacheFields[field].splice(index, 1);
@@ -1092,8 +1099,8 @@
 
             if (this._cacheFields[field].length == 0) {
                 // There is no field with the same name
-                delete this.options.fields[field];
-                delete this._cacheFields[field];
+                //delete this.options.fields[field];
+                //delete this._cacheFields[field];
             } else if ('checkbox' == type || 'radio' == type) {
                 this._initField(field);
             }