jQuery проверить несколько полей с одним и тем же именем

У меня есть эта форма с входами с тем же именем, но схожими (инкрементными) идентификаторами.

Я хочу, чтобы форма подтверждала, если есть имя человека, возраст должен быть обязательным.

Что происходит сейчас, так это то, что только первый ввод является обязательным.

Вот мой код:

<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>

 Francisco Tomé Costa27 янв. 2012 г., 14:27
@nnnnnn у вас есть идея, почему проверяется только первый вход?
 Osoian Marcel04 авг. 2017 г., 11:06
У меня была та же проблема с несколькими: <input type = "file" name = "file []">. Чтобы проверить все входные данные, просто установите разные номера индекса для каждого файла. Например: файл [0], файл [1], файл [2] и т. Д.
 nnnnnn27 янв. 2012 г., 13:34
@ stian.net - Нет проблем с повторением входных имен, фактически это довольно стандартная практика для табличных данных. Это, конечно, не то, что создает трудности в этом случае.
 stian.net27 янв. 2012 г., 13:23
иметь несколько текстовых полей с одним и тем же именем, вероятно, плохая идея !?
 Francisco Tomé Costa27 янв. 2012 г., 13:27
Я нашел здесь в stackoverflow некоторые ответы с помощью функции .each (), но я не смог заставить ее работать. В будущем у меня будет динамическое число «строк», поэтому я бы предпочел иметь то же имя, чтобы я мог получить их проще на стороне сервера

Ответы на вопрос(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>

 Francisco Tomé Costa27 янв. 2012 г., 13:42
не мог заставить это работать таким образом
 Matthew Lock08 мая 2012 г., 07:32
подход массива квадратных скобок работает только в PHP AFAIK

Чтобы проверить текстовое поле с тем же именем, используйте следующее, оно отлично работает для меня. Кроме того, нет необходимости объявлять входной параметр как массив.

Здесь 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;
 }

Надеюсь это поможет!! Джагана

Ваш ответ на вопрос