jQuery驗證表單上的所有選項卡提交

Question

當前jQuery驗證插件僅驗證選定的選項卡。因此，爲了讓所有標籤被驗證，我推出了忽略屬性

$("form").validate({ 
.... 
.... 
ignore:"ui-tabs-hide" 
}); 

但是，在給予它後，它甚至驗證隱藏的字段。有沒有辦法通過忽略每個選項卡上的隱藏字段來驗證所有選項卡上的字段。

HTML

<div id="tabs"> 
<%@include file="inc/tabsList.jsp" %> <!--has <a> link for each div --> 

<div id="fragment-1"><%@include file="inc/tradeDetails.jsp" %></div> 
<div id="fragment-2"><%@include file="inc/beneficiaryDetails.jsp" %></div> 
<div id="fragment-3"><%@include file="inc/referenceDetails.jsp" %></div> 
<div id="fragment-4"><%@include file="inc/summary.jsp"%></div> 

<div class="clear"></div> 

</div> 

的JavaScript

$(function() { 
var hiddenChevron; 
var $tabs = $('#tabs').tabs(); 

$("#fWdErrors_940").hide(); 

$("#singleSpotForm").validate({ 
     rules: { 
      'singleSpotRequestVO.entity.entityName' : "required", 
      'singleSpotRequestVO.subEntity.entityName' : "required",     
      'singleSpotRequestVO.transactionType' : "required", 
      'singleSpotRequestVO.tradeCurrencyId' : "required" 
     }, 
     errorContainer: 'fWdErrors_940', 
     errorClass: "errorMsgItemText", 
     errorPlacement: function(error, element) {    
      error.appendTo(element.parent("td").last()); 
     }, 
     invalidHandler: function(form, validator) { 
      var errors = validator.numberOfInvalids(); 
      if(errors){ 
       var message = validator.numberOfInvalids() == 1 ? 
         validator.numberOfInvalids() + " error " : 
         validator.numberOfInvalids() + " errors "; 
       $(".failureErrCount").html(message); 
       $("#fWdErrors_940").show().focus(); 
      }else{ 
       $("#fWdErrors_940").hide(); 
      } 

     }, 
     onkeyup : false, 
     ignore: "ui-tabs-hide" 

}); 
}) 

Answer 1

外觀極好...的解決辦法是組合：

$("form").validate({ 
.... 
.... 
ignore:"ui-tabs-hide" 
}); 

更多...

$("div[id^=fragment-]").bind("click", function() { 
    $("div[id^=fragment-]").children("input, select, textarea").prop("disabled", true); 
    $(this).children("input, select, textarea").prop("disabled", false); 
}); 

Answer 2

你需要作出禁止其他控件。

試試這個：

$("div[id^=fragment-]").bind("click", function() { 
    $("div[id^=fragment-]").children("input, select, textarea").prop("disabled", true); 
    $(this).children("input, select, textarea").prop("disabled", false); 
}); 

這將保持啓用當前選項卡的控制和其他選項卡控制禁用，從而驗證將驗證只在選項卡中的當前元素。