title: Multiple Tab Validation is not working
body: <p>When I click the submit button the multiple tab validation is not working. I have around 12 tabs. If I click Submit button within any tab it simply submitted. The other tabs are not getting validated.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> $("#btn-login").click(function () {
          var IsValid = true;
  
          // Validate Each Bootstrap tab
          $(".tab-content").find("div.tab-pane").each(function (index, tab) {
              var id = $(tab).attr("id");
              alert(id);
              //$('a[href="#' + id + '"]').click(function (e) {
              //    e.preventDefault();
              //    $(this).tab('show');
              //});
              $('a[href="#' + id + '"]').tab('show');
              //$('.nav-tabs a[href="#' + id + '"]').tab('show');
              //alert($('a[href="#' + id + '"]').attr("href") + " 2345");
              alert("succ11");
              var IsTabValid = $("#" + id).validate();
             
              alert("succ12");
              if (IsTabValid.valid()) {
                  alert(id + " success");
                  IsValid = false;
              }
          });
  
      });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style=" padding-left:0px; padding-right:0px;"&gt;
                      &lt;div class="tabs-left" style="padding-top: 0px; margin-top: 0px;"&gt;
                          &lt;ul class="nav nav-tabs" id="tabs"&gt;
                              &lt;li id="hm" class="active"&gt;&lt;a href="#status" data-toggle="tab" data-target="#status"&gt;&lt;span class="icon-time" style="color: white; font-size: 15px"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li id="edu"&gt;&lt;a href="#passport" data-toggle="tab" data-target="#passport"&gt;&lt;span class="icon-globe" style="color: white; font-size: 15px"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;li id="pro"&gt;&lt;a href="#movement" data-toggle="tab" data-target="#movement"&gt;&lt;span class="icon-move" style="color: white; font-size: 15px"&gt;&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
  ...
  ...
  ...
  ...
  &lt;/div&gt;
  &lt;/div&gt;
  
  
   &lt;div class="modal-footer" style="padding-bottom: 0px; margin-top:10px;"&gt;
                                          &lt;input type="submit" id="btn-login" class="btn btn-success" value="Submit" /&gt;
                                 
                                          &lt;button type="button" class="btn btn-danger modal-close-btn" data-dismiss="modal"&gt;Cancel&lt;/button&gt;
                                         &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>