Jquery 如何使用addClassRules向类添加消息

我正在使用验证包含大量重复数据行的页面。由于空间有限，每行都有自己的验证摘要

我使用addClassRules将验证规则应用于页面，但默认错误消息在摘要中过于通用（例如，“Field is required，Field is required等）

例如：

jQuery.validator.addClassRules({
amount: {
    required: true,
    range: [0, 2000000]
},
comment: {
    maxlength: 51
},
owner: {
    notFirstOption: true
},
A: {
    required: function (element) {  
        return getParentElement($(element), "tr").find(".colB input.B").val().length > 0;
    },
    digits: true
}});

您能为每个验证类中的规则应用自定义消息吗？理想情况下，我想要的是：

jQuery.validator.addClassMessages({
    amount: {
        required: "Amount is required",
        range: "Amount must be between 0 and 2,000,000"
    },
    comment: {
        maxlength: "Comment may be a maximum of 51 characters"
    },
    owner: {
        notFirstOption: "Please select an owner"
    },
    A: {
        required: "A is required if B is entered",
        digits: "A must be numeric"
    }});

---

提前感谢您提供的任何帮助！

我想出了一个非常糟糕的解决方案，但希望能用更多的时间得到更干净的东西

无论如何，通过jQuery元数据分配消息，我可以为每个类定制消息

class="amount {validate:
                {messages:
                  {required:'Amount is required',
                   range: 'Amount must be between 0 and 2,000,000',
                   digits: 'Amount must be numeric'}
                }
              }"

…对于我的网格行中的每个字段，依此类推

---

我将考虑扩展“addClassRules”方法以接受messages参数，但目前这是可行的，所以它会这样做。

因为每个人都对这个方法的响应感兴趣，下面是我寻求答案的下一步

我在插件中添加了允许添加类消息的方法，并修改了默认的消息处理程序来选择这些消息

在“customMetaMessage”之前添加

customClassMessage: function (element, method) {
    //Get the elements class(es)
    var classes = $(element).attr("class").split(" ");

    //return any message associated with said class and method
    var m = $.validator.messages[classes[0]];

    return m && (m.constructor == String
        ? m
        : m[method]);
},

修改了“defaultMessage”以包含对上述方法的调用

defaultMessage: function (element, method) {
                return this.findDefined(
                this.customMessage(element.name, method),
                this.customMetaMessage(element, method),
                this.customClassMessage(element, method),
                // title is never undefined, so handle empty string as undefined
                !this.settings.ignoreTitle && element.title || undefined,
                $.validator.messages[method],
                "<strong>Warning: No message defined for " + element.name + "</strong>"
            );
            },

到目前为止，我还无法解决如何在插件之外附加这些附加方法。不过，至少我不必在“class”属性中声明错误消息

jQuery.validator.addClassMessages({
    amount: {
        required: "Amount is required",
        range: "Amount must be between 0 and 2,000,000",
        digits: "Amount must be numeric"
    }
});

试试这个：

jQuery.validator.addClassRules({
    amount: {
        required: true,
        range: [0, 2000000],
        messages: {required: "Required field!", range: "Invalid range!"}
    },
    comment: {
        maxlength: 51,
        messages: {maxlength: "Max 51 characters!"}
    }
})

---

我认为这就是您要寻找的，对吗？

在文档中，答案是将要调用的方法别名并添加自定义消息

在“重构规则”标题下：

---

这可以使用下面的代码来完成

  $.validator.messages.accept = 'File must be JPG, GIF or PNG';

    $.validator.addClassRules("files", {            
      accept : "png|jpe?g|gif",  
      filesize : 2000000
    });

---

将数据msg required=“Error message here”与要进行验证的元素一起使用

<select name="account1" data-msg-required="Please select an account">
<option value="">--Select Account--</option>
<optgroup label="100-Assets">
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="3">C</option>
    <option value="4">D</option>
</optgroup>

--选择帐户--
A.
B
C
D

---

建议的答案要求编写自定义方法或常见错误消息，这有时不容易自定义。以下一个方法适用于我，如中所述：

用法：

$.validator.addClassRules({
    'firstname': {
        required: true,
        messages: {
            required: "First name is required"
        }
    }
});

---

你必须等我检查一下，但有机会我会给你回电话的。这很简单，但一定是对的！干杯“可以提供给，但不能提供给。我还尝试了@Martin Karlsson对jquery validation v1.19.3的建议，它对显示的消息没有影响。谢谢，你是胡说八道。你可能需要使用$.validator.format（）代替$.format。根据v1.15，函数

customMetaMessage

现在被重命名为

customDataMessage

。我修改了

customClassMessage

的中间部分，这样表单验证类就不必是类中的第一个：

var m=classes.map（函数（c）{return$.validator.messages[c]}）；m=m[0]我推荐此解决方案，因为它简单明了，并且可以与内置规则和自定义规则一起使用。当然，现在在插件中添加错误消息方面也取得了很大的进展（只需查看文档）。哦，顺便说一句，您也可以使用
$.extend（）
在一个步骤中将自定义规则消息与内置消息组合在一起，如
$.validator.messages=$.extend（$.validator.messages，Object MyCustomMessages）
或诸如此类。
<select name="account1" data-msg-required="Please select an account">
<option value="">--Select Account--</option>
<optgroup label="100-Assets">
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="3">C</option>
    <option value="4">D</option>
</optgroup>

$.validator.addClassRules = function (className, rules) {

    if (className.constructor === String) {
        var obj = {};
        obj[className] = rules;
        className = obj;
    }

    $.each(className, function (n, r) {
        $("." + n).each(function (i, e) {
            var self = $(e)
            self.rules('add', r);
        });
    });

}

$.validator.addClassRules({
    'firstname': {
        required: true,
        messages: {
            required: "First name is required"
        }
    }
});