小编moe*_*ans的帖子

Jquery验证不适用于折叠的引导程序面板

好吧,对于我的HTML,我有这个bootstrap崩溃和它内部的一些表单字段.

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
    <div class="panel panel-success">
       <div class="panel-heading" role="tab" id="generalHeading">
          <h4 class="panel-title">General</h4>
       </div>
       <div id="generalInfo" class="panel-collapse collapse in" role="tabpanel">
          ...
       </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

有多个面板,显然...是上面示例中的表单字段.

然后我将表单提交给jquery验证.如果我"打开"上面的所有面板,验证将起作用.如果我按照它应该这样做并且只打开最后一个面板,其中只有提交按钮,则验证运行就像它没有问题.它没有看到折叠面板中的字段?

我没有找到任何答案,希望社区能帮助我.

如何在折叠引导面板时运行jquery验证?

根据要求,我创建了一个JS小提琴

一旦您加载小提琴并尝试提交表单(向下滚动预览),您将看到您收到恼人的警报,它会告诉您表单缺少必填字段. 这应该发生!

现在,如果您滚动到line 90HTML并删除in以下div的类名称上的单词:

<div id="priorityInfo" class="panel-collapse collapse in" role="tabpanel">

并重新加载小提琴,然后通过面板并尝试再次提交,你会发现你没有得到任何恼人的警报或通知.除非您收到一条通知表明表单已提交.

这是问题,因为你没有把你的姓名或电子邮件地址放进去.

javascript jquery jquery-validate twitter-bootstrap

6
推荐指数
1
解决办法
9693
查看次数