【问题标题】:jQuery validate - two required fields with one error messagejQuery 验证 - 两个必填字段和一个错误消息
【发布时间】:2012-04-09 17:10:17
【问题描述】:

我一直在尝试使用 jQuery validate plugin 的“组”选项来验证两个选择框,这两个选择框都是必需的,但应该只显示一条错误消息:

JavaScript:

$('form').validate({
    groups: {
        cardExpiration: 'card_expirationMonth card_expirationYear'
    },
    rules: {
        card_expirationMonth: 'required',
        card_expirationYear: 'required'
    },
    errorPlacement: function (error, element) {
        if (element[0].name === 'card_expirationMonth' || element[0].name === 'card_expirationYear') {
            error.prependTo('form');
        }
    }
});

标记:

<form method="post" action="/wherever">
    <div class="-field field-expirationMonth">
        <select name="card_expirationMonth" id="card_expirationMonth">
            <option value="">MM</option>
            <option value="01">01</option>
            <option value="02">02</option>
            <option value="03">03</option>
            <option value="04">04</option>
            <option value="etc">Etc</option>
        </select>
    </div>
    <div class="-field field-expirationYear">
        <select name="card_expirationYear" id="card_expirationYear">
            <option value="">YY</option>
            <option value="2012">12</option>
            <option value="2013">13</option>
            <option value="2014">14</option>
            <option value="2015">15</option>
            <option value="etc">Etc</option>
        </select>
    </div>
</form>

这似乎对错误消息进行了分组,因此只有一个可见,但它似乎采取了只需要组中的一个字段的方法......有什么想法吗?

【问题讨论】:

    标签: javascript jquery jquery-validate


    【解决方案1】:

    http://docs.jquery.com/Plugins/Validation/validate#options 上的演示显示了以下代码:

    $("#myform").validate({
      groups: {
        username: "fname lname"
      },
      errorPlacement: function(error, element) {
         if (element.attr("name") == "fname" 
                     || element.attr("name") == "lname" )
           error.insertAfter("#lastname");
         else
           error.insertAfter(element);
       },
       debug:true
     })
    

    请注意“规则”不存在。如果您从代码中删除它,也许事情会有所改善。

    【讨论】:

    • 是的,我已阅读文档 - 规则用于定义应在命名元素上进行的验证方法。 (演示中没有它的原因是因为规则是使用类属性以声明方式定义的)。
    • @riscarrott:我很感兴趣的是页面上的其他示例在验证方法选项中使用“规则”,而这个使用类属性。你试过这样吗?
    • 是的,我两种方式都试过了——其他人通常使用“规则”而不是类或元数据,因为他们展示了我认为更具体的东西。
    • 这个插件应该是全部,但我只是没有留下深刻的印象!
    • @riscarrott:好吧,如果你足够勇敢/耐心,你可以在插件代码中找到问题,修复它并提交给适当的人。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-02-23
    • 1970-01-01
    • 2015-03-08
    • 2023-03-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多