плагин проверки jQuery с использованием нескольких 'div's - PullRequest
0 голосов
/ 30 августа 2011

Я использую фантастический плагин проверки jQuery .Он хорошо работает с одной формой, но если я использую div s в этой форме, он не работает (по крайней мере, он работает только для первого div).

Я хотел бы три столбцаформа макета (левый, центральный и правый столбцы div).Проверки работают хорошо только в левом (первом) столбце.Если я присоединяюсь ко всем столбцам, он снова работает отлично.Он перестает работать после первого закрытия Div ... Я хотел бы проверить, когда нажата кнопка отправки нажмите.

<script type="text/javascript">
    $(document).ready(function() {
        // Validate signup form on keyup and submit
        var validator = $("#form").validate({
            rules: {
                name: {required: true,},
                age:  {required: true,},
                city: {required: true,}
            },
            messages: {
                name: {required: "required"},
                age:  {required: "required"},
                city: {required: "required"}
            },
        });
    });
</script>

<div class="left">
    <form id="form" class="form" action="REGISTER.PRO" method="post">
        <input id="name" name="name" value="" type="text" class="name"/>
        </div>
        <div class="center">
            <input id="age" name="age" value="" type="text" class="age"/>
        </div>
        <div class="right">
            <input id="city" name="city" value="" type="text" class="city"/>
            <button>Register</button>
    </form>
</div>

Как я могу это сделать?

1 Ответ

0 голосов
/ 30 августа 2011

У вас недопустимая разметка (неправильно вложенные элементы div) и неверный код JavaScript (конечные запятые).Вот как это исправить:

<form id="form">
    <div class="left">
        <input id="name" name="name" value="" type="text" class="name"/>
    </div>
    <div class="center">
        <input id="age" name="age" value="" type="text" class="age"/>
    </div>
    <div class="right">
        <input id="city" name="city" value="" type="text" class="city"/>
    </div>
    <button>Register</button>
</form>

И код JavaScript:

$("#form").validate({
    rules: {
        name: {
            required: true
        },
        age: {
            required: true
        },
        city: {
            required: true
        }
    },
    messages: {
        name: {
            required: "required"
        },
        age: {
            required: "required"
        },
        city: {
            required: "required"
        }
    }
});

И живая демонстрация .

...