Question

我正试图解决这个问题，但无论我尝试什么（基于此处的几个建议解决方案），我都无法让它发挥作用。

我希望Jquery验证插件自动验证表单中所有生成的字段。我的问题是它只能在第一个生成的字段上工作;后续的验证将只是第一个的重复。

以下是相关的HTML代码：

<form class="someFormClass" method="post">                     
<span>
    <input class="calendarName" name="description" value="<?= value_from_php ?>">
    <input class="calendarName" name="description" value="<?= value_from_php ?>">
</span>                                 
</form>

这是jQuery验证码：

$(function () {
$('form').each(function () {
    $(this).validate({
        errorElement: "div",
        rules: {
            description: {
                required: true,
                remote: {
                    url: "calendar/calendar_available/",
                    type: "post",
                    data: {
                        name: function () {
                            return $(".calendarName").val();
                        }
                    }
                }
            }
        },
        messages: {
            description: {
                required: "Description field can't be blank !",
                remote: "This calendar already exists."
            }
        }
    });
});

因此，如上所述，插件在第一个字段中表现正常。但是，如果我检查Chrome网络中发布的值，那么在jQuery验证中创建的“name”键将始终发送第一个输入的值。

我尝试了很多东西（尝试在验证中实现更多级别的“.each”方法，尝试动态生成每个字段的特定id以指向（而不是类），尝试修改插件代码正如这里所建议的那样（How to validate array of inputs using validate plugin jquery），但它不起作用。

我认为这里有一些关于逻辑的东西。

更新： 所以，我的问题的原因之一是jQuery验证绝对需要输入不同的名称。请参阅：Jquery Validation with multiple textboxes with same name and corresponding checkboxes with same name

因此，我制作了一个脚本，为每个输入生成一个不同的名称，以便根据这些名称动态创建验证规则：https://stackoverflow.com/a/2700420/3504492

我的验证脚本现在看起来像这样：

$(function() {
var rules = new Object();
var messages = new Object();

$('input[name*=description_]:text').each(function() {
    var currentName = $("input[name="+this.name+"]").val();
    rules[this.name] = { 
            description: {
                required: true,
                    remote: {
                        url: "calendar/calendar_available/",
                        type: "post",
                        data: currentName
                        }
                    }
                },
            color: {required: true}    
    };
    messages[this.name] = { 
        description: {
                    required: "Description field can't be blank !",
                    remote: "This calendar already exists."
                },
        color: {required: "Color field can't be blank !"}
        };
});    

$('form').each(function () {
    $(this).validate({
        errorElement: "div",
        rules: rules,
        messages: messages                
    });
})                });

这几乎可行。几乎是因为如果我将规则和消息限制为所需的密钥，它将显示每个字段的验证（如果我将特定名称添加到消息字符串，它将显示在正确的字段上）。但是对于像我这样最复杂的规则（例如，远程密钥包含各种键），我得到一个“无法读取未定义的属性'调用'。检查元素时发生异常，检查'description'方法。”控制台中出错。我的猜测是“规则”定义中的“描述”声明也应该是动态的（正在访问的当前“名称”字段）。

有什么建议吗？

JQuery验证仅适用于第一个生成的输入

0 个答案: