jquery-validate - jQuery 验证动态创建的元素的错误消息

Question

我正在开发一个根据用户选择动态添加多达 10 个字段的表单。我必须验证所有动态添加的元素。到这里为止，除了错误消息外，一切正常。例如，如果用户未输入字段 2 的值并提交表单，则错误消息应为“请输入访客 2 的姓名”。如果用户未输入字段 3，则错误应更改为“请输入访客 3 的姓名”。除了在所有字段中显示相同的消息外，我已经让它工作了。假设用户添加了 5 个字段。对于所有输入字段，所有字段都显示相同的错误消息“请输入访客 5 的姓名”。

这是我的代码：

$('.visitors_name').each(function (key, value) {
    $(this).rules('add', {
        required: true,
        minlength: 2,
        maxlength: 50,
        messages: {
            required: "Please Enter Visitor "+key+"'s Name",
        }
    });
});

请问有什么帮助吗？

标签： jquery-validate

Answer 1

您将不得不使用 afunction来动态构造和return消息...

$('.visitors_name').each(function (key, value) {
    $(this).rules('add', {
        required: true,
        minlength: 2,
        maxlength: 50,
        messages: {
            required: function() {
                return "Please Enter Visitor " + key + "'s Name";
            }
        }
    });
});

演示： jsfiddle.net/6z9Lv8pk/