浏览代码

#206, #338: Add back bv-tab-error and bv-tab-success classes to tab

nghuuphuoc 11 年之前
父节点
当前提交
f77026a2ee

+ 7 - 21
demo/tab.html

@@ -10,15 +10,6 @@
     <script type="text/javascript" src="../vendor/jquery/jquery-1.10.2.min.js"></script>
     <script type="text/javascript" src="../vendor/bootstrap/js/bootstrap.min.js"></script>
     <script type="text/javascript" src="../dist/js/bootstrapValidator.js"></script>
-
-    <style type="text/css">
-    .nav-tabs li.tab-success > a {
-        color: #3c763d;
-    }
-    .nav-tabs li.tab-error > a {
-        color: #a94442;
-    }
-    </style>
 </head>
 <body>
     <div class="container">
@@ -145,20 +136,15 @@ $(document).ready(function() {
                 $tabPane  = data.element.parents('.tab-pane'),
                 tabId     = $tabPane.attr('id');
             if (tabId) {
-                var $tab = $('a[href="#' + tabId + '"][data-toggle="tab"]').parent();
+                var $icon = $('a[href="#' + tabId + '"][data-toggle="tab"]').parent().find('i');
 
                 // Add custom class to tab containing the field
-                if ($tab) {
-                    $tab.removeClass('tab-success').removeClass('tab-error');
-                    if (data.status == validator.STATUS_INVALID) {
-                        $tab.addClass('tab-error').find('i').removeClass('fa-check').addClass('fa-times');
-                    } else if (data.status == validator.STATUS_VALID) {
-                        var isValidTab = validator.isValidContainer($tabPane);
-                        $tab.addClass(isValidTab ? 'tab-success' : 'tab-error')
-                            .find('i')
-                                .removeClass('fa-check fa-times')
-                                .addClass(isValidTab ? 'fa-check' : 'fa-times');
-                    }
+                if (data.status == validator.STATUS_INVALID) {
+                    $icon.removeClass('fa-check').addClass('fa-times');
+                } else if (data.status == validator.STATUS_VALID) {
+                    var isValidTab = validator.isValidContainer($tabPane);
+                    $icon.removeClass('fa-check fa-times')
+                         .addClass(isValidTab ? 'fa-check' : 'fa-times');
                 }
             }
         });

+ 6 - 0
dist/css/bootstrapValidator.css

@@ -14,3 +14,9 @@
 .bv-form .tooltip-inner {
     text-align: left;
 }
+.nav-tabs li.bv-tab-success > a {
+    color: #3c763d;
+}
+.nav-tabs li.bv-tab-error > a {
+    color: #a94442;
+}

+ 1 - 1
dist/css/bootstrapValidator.min.css

@@ -10,4 +10,4 @@
  */
 
 
-.bv-form .help-block{margin-bottom:0}.bv-form .tooltip-inner{text-align:left}
+.bv-form .help-block{margin-bottom:0}.bv-form .tooltip-inner{text-align:left}.nav-tabs li.bv-tab-success>a{color:#3c763d}.nav-tabs li.bv-tab-error>a{color:#a94442}

+ 20 - 0
dist/js/bootstrapValidator.js

@@ -815,6 +815,14 @@
 
                 // Show/hide error elements and feedback icons
                 $errors.attr('data-bv-result', status);
+
+                // Determine the tab containing the element
+                var $tabPane = $field.parents('.tab-pane'),
+                    tabId, $tab;
+                if ($tabPane && (tabId = $tabPane.attr('id'))) {
+                    $tab = $('a[href="#' + tabId + '"][data-toggle="tab"]').parent();
+                }
+
                 switch (status) {
                     case this.STATUS_VALIDATING:
                         isValidField = null;
@@ -823,6 +831,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.invalid).addClass(this.options.feedbackIcons.validating).show();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_INVALID:
@@ -832,6 +843,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.validating).addClass(this.options.feedbackIcons.invalid).show();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').addClass('bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_VALID:
@@ -850,6 +864,9 @@
                         }
 
                         $parent.removeClass('has-error has-success').addClass(this.isValidContainer($parent) ? 'has-success' : 'has-error');
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error').addClass(this.isValidContainer($tabPane) ? 'bv-tab-success' : 'bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_NOT_VALIDATED:
@@ -860,6 +877,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.invalid).removeClass(this.options.feedbackIcons.validating).hide();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error');
+                        }
                         break;
                 }
 

文件差异内容过多而无法显示
+ 2 - 2
dist/js/bootstrapValidator.min.js


+ 6 - 0
src/css/bootstrapValidator.css

@@ -14,3 +14,9 @@
 .bv-form .tooltip-inner {
     text-align: left;
 }
+.nav-tabs li.bv-tab-success > a {
+    color: #3c763d;
+}
+.nav-tabs li.bv-tab-error > a {
+    color: #a94442;
+}

+ 20 - 0
src/js/bootstrapValidator.js

@@ -814,6 +814,14 @@
 
                 // Show/hide error elements and feedback icons
                 $errors.attr('data-bv-result', status);
+
+                // Determine the tab containing the element
+                var $tabPane = $field.parents('.tab-pane'),
+                    tabId, $tab;
+                if ($tabPane && (tabId = $tabPane.attr('id'))) {
+                    $tab = $('a[href="#' + tabId + '"][data-toggle="tab"]').parent();
+                }
+
                 switch (status) {
                     case this.STATUS_VALIDATING:
                         isValidField = null;
@@ -822,6 +830,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.invalid).addClass(this.options.feedbackIcons.validating).show();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_INVALID:
@@ -831,6 +842,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.validating).addClass(this.options.feedbackIcons.invalid).show();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').addClass('bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_VALID:
@@ -849,6 +863,9 @@
                         }
 
                         $parent.removeClass('has-error has-success').addClass(this.isValidContainer($parent) ? 'has-success' : 'has-error');
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error').addClass(this.isValidContainer($tabPane) ? 'bv-tab-success' : 'bv-tab-error');
+                        }
                         break;
 
                     case this.STATUS_NOT_VALIDATED:
@@ -859,6 +876,9 @@
                         if ($icon) {
                             $icon.removeClass(this.options.feedbackIcons.valid).removeClass(this.options.feedbackIcons.invalid).removeClass(this.options.feedbackIcons.validating).hide();
                         }
+                        if ($tab) {
+                            $tab.removeClass('bv-tab-success').removeClass('bv-tab-error');
+                        }
                         break;
                 }