jQuery验证具有相同名称的多个字段答案

【问题标题】：jQuery Validate multiple fields with the same namejQuery验证具有相同名称的多个字段
【发布时间】：2012-01-27 12:21:44
【问题描述】：

我有这个表单，输入具有相同的名称但相似的（增量）ID。

我希望表单验证是否有姓名，年龄必须是强制性的..

现在发生的情况是只有第一个输入是强制性的。

这是我的代码：

<html lang="en">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
</head>
<body>
    <form id="people">
        <div class="section">
            <input id="person1" name="person" class="person" type="text" placeholder="First Name" />
            <input id="age1" name="age" class="age" type="text" placeholder="Age" />
        </div>
        <div class="section">
            <input id="person2" name="person" class="person" type="text" placeholder="First Name" />
            <input id="age2" name="age" class="age" type="text" placeholder="Age" />
        </div>
        <div class="section">
            <input id="person3" name="person" class="person" type="text" placeholder="First Name" />
            <input id="age3" name="age" class="age" type="text" placeholder="Age" />
        </div>
        ...
        <input type="submit" id="submit" name="submit" value="Add" />
    </form>
    <script type="text/javascript">
        $(function(){
            $('#people').validate();
            $('#submit').click(function(){
                $('[id^="person"]').each(function(){
                    if ($(this).val().length>0){
                        //alert($(this).val());
                        //alert($(this).parent().find('.age').val());
                        $(this).rules('add', {
                            required: true,
                            minlength: 2,
                            messages: {
                                required: "Specify the person name",
                                minlength: "Minimum of 2 characters"
                            }
                        });
                        $(this).parent().find('.age').rules('add', {
                            required: true,
                            number: true,
                            messages: {
                                required: "Must have an age",
                                number: "Specify a valid age"
                            }
                        });
                    }
                });
            });
        });
    </script>
</body>

【问题讨论】：

拥有多个同名文本框可能是个坏主意！？
我在 stackoverflow 中找到了一些带有 .each() 函数的答案，但我无法使其工作。将来我会有动态的“行数”，所以我希望有相同的名称，以便我可以在服务器端更轻松地使用它们
@stian.net - 重复输入名称没有问题，事实上这是表格数据的标准做法。在这种情况下，这当然不是造成困难的原因。
@nnnnnn 你知道为什么只验证第一个输入吗？
我遇到了同样的问题：。要验证所有输入，只需为每个文件设置不同的索引号。例如：文件[0]、文件[1]、文件[2]等

标签： jquery jquery-validate

【解决方案1】：

jQuery Validator 插件不支持开箱即用的多个同名字段。您需要编辑插件的源代码以按照您想要的方式检查字段。

有关解决方法，请参阅this answer 的类似问题。

【讨论】：

【解决方案2】：

朋友们！

为了验证具有相同名称的文本框，请使用以下内容，它对我来说工作正常。另外，不需要将输入参数声明为数组。

这里的“minVal”是文本框的名称。同样，对于下拉菜单，请使用 'document.getElementsByTagName("select");'

function validateMinimumVal(){
    inp = document.getElementsByTagName("TEXT");
    for ( var i = 0; i < inp.length; ++i )    {
        if (inp[i].name =="minVal" && inp[i].value==''){
            alert('plesae Add a MINIMUM VALUE!!');
                return false;
            }
        }
    return true;
 }

希望这会有所帮助！！贾根

【讨论】：

【解决方案3】：

    <div class="section">
        <input id="person1" name="person[]" class="person" type="text" placeholder="First Name" />
        <input id="age1" name="age[]" class="age" type="text" placeholder="Age" />
    </div>
    <div class="section">
        <input id="person2" name="person[]" class="person" type="text" placeholder="First Name" />
        <input id="age2" name="age[]" class="age" type="text" placeholder="Age" />
    </div>
    <div class="section">
       <input id="person3" name="person[]" class="person" type="text" placeholder="First Name" />
       <input id="age3" name="age[]" class="age" type="text" placeholder="Age" />
    </div>

您应该添加方括号并循环遍历数组。

【讨论】：