JQuery проверить одно и то же имя во входных данных - PullRequest
1 голос
/ 27 января 2012

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

Форма должна проверяться, если на лице есть имя, возраст должен быть обязательным.

Сейчастолько первый ввод обязателен.

Вот мой код:

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

1 Ответ

0 голосов
/ 27 января 2012

У меня нет этого 100% пути, но я думаю, что есть несколько проблем ... Одна из них заключается в том, что использование щелчка для отправки в качестве триггера может мешать отдельному вызову для проверки формы (т.е. проверка дважды), а во-вторых, входные данные не имеют уникальных имен.

ОБНОВЛЕНИЕ:

   <form id="people" method="post">
        <div class="section">
            <input id="person1" name="person1" class="person" type="text" placeholder="First Name" />
            <input id="age1" name="age1" class="age" type="text" placeholder="Age" />
        </div>
        <div class="section">
            <input id="person2" name="person2" class="person" type="text" placeholder="First Name" />
            <input id="age2" name="age2" class="age" type="text" placeholder="Age" />
        </div>
        <div class="section">
            <input id="person3" name="person3" class="person" type="text" placeholder="First Name" />
            <input id="age3" name="age3" class="age" type="text" placeholder="Age" />
        </div>
        <input type="submit" id="submit" name="submit" value="Add" />
    </form>


$(function() {
    $('#people').validate();

    $('.person').blur(function() {

        if ($(this).val().length) {

            //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).next('input').rules('add', {
                required: true,
                number: true,
                messages: {
                    required: "Must have an age",
                    number: "Specify a valid age"
                }
            });

        }
    });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...