【问题标题】:How to validate the input boxes in multi-tabs如何验证多选项卡中的输入框
【发布时间】:2012-04-04 16:20:36
【问题描述】:

我正在使用 jquery validate 和 jquery tabs 创建一个多标签表单

假设一个简单的形式:

tab 1 输入地址,tab 2 输入姓名,tab 3 提交

html

<ul class="nav nav-tabs">
  <li class="active"><a href="#home">address</a></li>
  <li><a href="#profile">name</a></li>
  <li><a href="#submit">submit</a></li>
</ul>

 <form id="selectList" method="post" action="finish.php">
<div class="tab-content">
  <div class="tab-pane active" id="home">//input box address</div>
  <div class="tab-pane" id="profile">//input box name</div>
  <div class="tab-pane" id="messages">//submit button</div>
</div>
 </form>

js 验证

  $("#selectList").validate( {
      rules: {
         "selectList[]": {
              required: true,
              minlength: 1
          }
       }
   })

});

问题是:

  1. 如您所见,虽然所有选项卡都在表单内,但是,如果提交按钮在选项卡 3 中,则无法验证选项卡 1、2 中的输入框,如何指定验证规则不同的标签?

谢谢

更新:

$("#optionalform").validate({
    ignore:''
});

使用这个独立可以帮助做到这一点,问题是,我无法设置规则,并且选项卡中的数据选择器插件和其他功能不起作用,它可能会跳过我的所有元素?

$(document).ready(function(){

$('.tabbable').tabs();
$("#selectList").validate({
    ignore:''

        rules: {
         "selectList[]": {
              required: true,
              minlength: 1
          }
       }
   })
          $('#dd').datebox({  
    required:true  
});



});


$(function(){
  $("#closeTab").click(function() {
             window.parent.$('#tt').tabs('close','Add Campaign'); 
             location.reload();     
  });
});

【问题讨论】:

  • 遵循缩进和间距的良好做法并没有什么坏处,但是您的语法有一些非常错误的地方。 ignore:'' 之后缺少逗号 ,。虽然我不确定您认为使用空参数可以实现什么。

标签: javascript jquery jquery-validate


【解决方案1】:

每次更改选项卡时都需要调用验证。

$('.selector').tabs({
    select: function(event, ui) { ... } //run validation here?
});

【讨论】:

  • 不太懂如何实现,能否提供一个简单的例子?
  • 其实我得到了一些东西,但它有一些缺陷
  • 谢谢,虽然你的回答不是我最终得到的
猜你喜欢
  • 1970-01-01
  • 2013-06-18
  • 1970-01-01
  • 2011-12-11
  • 2020-07-02
  • 1970-01-01
  • 1970-01-01
  • 2017-11-23
  • 2011-08-03
相关资源
最近更新 更多