1

我的表单有四个字段。我需要：
- 如果至少填充了一个字段，则验证成功
- 对所有字段使用相同的错误“请输入电话或电子邮件”

下面的代码在条件基础上不起作用 - 即使我使用该函数一次检查所有字段，所有字段也会单独验证。我究竟做错了什么？

var rule = function (el) {
//return                                        <-- old
  return (                                    //<-- new
    ($("#CustomerEmail").val() === "") &&
    ($("#CustomerMobile").val() === "") &&
    ($("#CustomerWork").val() === "") &&
    ($("#CustomerHome").val() === "")
  //;                                         <-- old
    );                                      //<-- new
  };

$("#CustomerEmail").rules("add", { required: rule });
$("#CustomerMobile").rules("add", { required: rule });
$("#CustomerWork").rules("add", { required: rule });
$("#CustomerHome").rules("add", { required: rule });

更新：

事实证明我的代码毕竟没问题，但那return是独立的，这让 JS 爆炸了。

仍然想知道如何将单个错误消息附加到组，而不是在验证失败时显示四个错误。

4

3 回答 3

0

如果填充了至少一个字段，则验证成功

仅当所有字段都有值时，您的规则才会成功（因为您使用的是 AND 运算符）。如果一个就足够了，请使用 OR 运算符

var rule = function (el) {
  return
    $("#CustomerEmail").val() ||
    $("#CustomerMobile").val() ||
    $("#CustomerWork").val() ||
    $("#CustomerHome").val();
  };
于 2013-01-01T18:32:35.830 回答
0

这是一个解决方案，首先涉及为Must_Have_One. 该方法name是添加到组中每个元素的匹配类，或者您可以使用rules对象来定义该方法。

HTML

<input name="name" class="must_have_one" />

JS

var $form_group=$('.must_have_one')

$.validator.addMethod("must_have_one", function() {
    var must_have_els=$form_group.filter(function(){
        return this.value !='';
    });

    if (must_have_els.length) {
        return true;
    } else {
        return false;
    }
}, 'Must have one of .....');

var myFormValidator = $("form").validate({
    groups: {
         must_have_one : "name email"
    },
    errorPlacement: function(error, element) {       
        if (myFormValidator.groups[element.attr("name")]) {
            /* determine placement for message for group*/
            error.insertAfter($form_group.last());
        }
        else error.insertAfter(element);
    }
})

演示：http: //jsfiddle.net/UzjZM/1/

于 2013-01-01T21:29:37.257 回答
0

尽管@charlietfl 的代码有效，但这是我原始代码的修改版本，它有效：

var eitherors = $("#CustomerEmail, #CustomerMobile, #CustomerWork, #CustomerHome");
var message  = "Please enter either a phone number or email address";

// define the required validation rule
// will return true when all inputs are blank
var requiredRule = function (el) {
  return eitherors
    .filter(function () { return $(this).val() !== "" })
    .length === 0;
};

// define the required validation error message
// returns the error message when 1) all inputs are
// blank, and 2) only for one of the fields (I chose the first one)
var requiredMessage = function (arg, el) {
  return (requiredRule() && eitherors.first().is(el))
    ? message
    : "";
};

// use same rule and message on all the "either-or" inputs
eitherors.each(function () {
  $(this).rules("add", {
    required: requiredRule,
    messages: { required: requiredMessage }
    });
  });

这是通用的，因此只需更改 jQuery 数组和错误消息即可处理任何元素组。

于 2013-01-02T00:05:59.013 回答