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

Excelent ......解决方案是组合：

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

这将启用当前选项卡的控件并禁用其他选项卡控件，因此验证程序将仅验证选项卡中的当前元素。

jQuery验证表单提交上的所有选项卡

2 个答案: