2015-01-07 80 views
3

当我单击提交按钮多选项卡验证不起作用。我有大约12个选项卡。如果我点击任何标签中的提交按钮,它只是提交。其他标签没有得到验证。多选项卡验证不起作用

$("#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; 
 
      } 
 
     }); 
 

 
    });
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style=" padding-left:0px; padding-right:0px;"> 
 
        <div class="tabs-left" style="padding-top: 0px; margin-top: 0px;"> 
 
         <ul class="nav nav-tabs" id="tabs"> 
 
          <li id="hm" class="active"><a href="#status" data-toggle="tab" data-target="#status"><span class="icon-time" style="color: white; font-size: 15px"></span></a></li> 
 
          <li id="edu"><a href="#passport" data-toggle="tab" data-target="#passport"><span class="icon-globe" style="color: white; font-size: 15px"></span></a></li> 
 
          <li id="pro"><a href="#movement" data-toggle="tab" data-target="#movement"><span class="icon-move" style="color: white; font-size: 15px"></span></a></li> 
 
... 
 
... 
 
... 
 
... 
 
</div> 
 
</div> 
 

 

 
<div class="modal-footer" style="padding-bottom: 0px; margin-top:10px;"> 
 
             <input type="submit" id="btn-login" class="btn btn-success" value="Submit" /> 
 
           
 
             <button type="button" class="btn btn-danger modal-close-btn" data-dismiss="modal">Cancel</button> 
 
             </div>

+0

改变这种请ID发布的HTML代码=“BTN-登录”,如果你创建的jsfiddle这将是更好的。 –

回答

5

如果使用jquery.validation,那么你可能打一个事实,即在默认情况下,它仅验证可见的控件。

您可以通过之前使用类似

$(document).ready(function(){ 
    $("form").validate().settings.ignore = ""; 
}