多标签验证不起作用答案

【问题标题】：Multiple Tab Validation is not working多标签验证不起作用
【发布时间】：2021-08-04 21:37:58
【问题描述】：

当我单击提交按钮时，多选项卡验证不起作用。我有大约 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>

【问题讨论】：

请把 id="btn-login" 的 HTML 代码贴出来，如果你创建一个 JsFiddle 会更好。

标签： asp.net-mvc asp.net-mvc-4 twitter-bootstrap-3

【解决方案1】：

如果您使用的是 jquery.validation，那么您可能会遇到这样一个事实：默认情况下，它只验证可见控件。

你可以通过使用类似的东西来改变它

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

【讨论】：

【解决方案2】：

默认情况下，jquery 验证不适用于隐藏字段（如隐藏选项卡）。要启用此功能，请将此代码添加到 ready 方法中

$.validator.setDefaults({
            ignore: []
   });

【讨论】：

【解决方案3】：

var dataForm = $('#form');
dataForm.mage('validation', {"ignore": ""});

【讨论】：

请在您的代码中添加解释以提高答案的质量。纯代码答案并不是特别有用。