Форма не проверяет поле, когда находит закрытый div между

Question

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

вот код, который я использую для формы.

<h1 class="com-response">Leave a reply for this Article</h1>
    <div class="com-respond">
        <div class="w340">
            <span class="com-label">Name</span>
                <form action="<?php $_SERVER['PHP_SELF']; ?>" method="post" id="formID">
                <input type="text" id="author" name="author" class="validate[required,custom[onlyLetter]]"/>
                <span class="com-label">email</span>
                <input type="text" id="email" name="email" class="validate[required,custom[email]]"/>
                <span class="com-label">Phone</span>
                <input type="text" id="phone" name="phone" class="validate[required,custom[telephone]]"/>
                <span class="com-label">Location</span>
                <input type="text" id="location" name="location" class="validate[required,custom[onlyLetter]]"/>
            </div>
        <div class="w340">
                <span class="com-label">Comment</span>
                <textarea rows="10" id="comment" name="comment" class="validate[required,length[6,300]]"></textarea>
                <input type="submit" value="Add Comment *" id="submit" name="submit"/>
                </form>
                <span class="title_sub">* your email and phone will be private and confidential by clicking on submit button you agree to our <a href="#">TOS</a></span>
        </div>
</div>

первый столбец проверяется без проблем, но я сталкиваюсь с проблемой второго столбца. т.е. текстовая область.

первый и второй столбцы заключены в div с именем w340. и между ними элемент формы w340 закрывается и снова открывается. закрывающий div создает проблему. если я удаляю его, он также проверяет текстовую область. но с закрытым div он отказывается проверять поле.

приветствуется любая помощь.

спасибо

РЕДАКТИРОВАТЬ: Вот JQuery я использую для этого.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.validationEngine-en.js" type="text/javascript"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("#formID").validationEngine({
})  
});
</script>

вот ссылка на плагин, который я использую

* ** тысяча двадцать-одина * -absolute.com одна тысячи двадцать-два / статьи / JQuery формы-валидатор-потому-форма-проверка-это-беспорядок /

Answer 1

Ваш документ неправильно сформирован: ваша форма начинается внутри одного элемента и заканчивается в другом. Переместите открывающие и закрывающие теги формы за пределы двух элементов div, например:

<h1 class="com-response">Leave a reply for this Article</h1>
    <div class="com-respond">
        <form action="<?php $_SERVER['PHP_SELF']; ?>" method="post" id="formID">
            <div class="w340">
                <span class="com-label">Name</span>
                <input type="text" id="author" name="author" class="validate[required,custom[onlyLetter]]"/>
                <span class="com-label">email</span>
                <input type="text" id="email" name="email" class="validate[required,custom[email]]"/>
                <span class="com-label">Phone</span>
                <input type="text" id="phone" name="phone" class="validate[required,custom[telephone]]"/>
                <span class="com-label">Location</span>
                <input type="text" id="location" name="location" class="validate[required,custom[onlyLetter]]"/>
            </div>
            <div class="w340">
                <span class="com-label">Comment</span>
                <textarea rows="10" id="comment" name="comment" class="validate[required,length[6,300]]"></textarea>
                <input type="submit" value="Add Comment *" id="submit" name="submit"/>
                <span class="title_sub">* your email and phone will be private and confidential by clicking on submit button you agree to our <a href="#">TOS</a></span>
            </div>
       </form>
    </div>

Несмотря на то, что браузер может понимать вашу форму, на самом деле незаконно делать вещи так, как вы их делали. Однако он не будет отображаться до тех пор, пока вы не попытаетесь разобрать HTML-код в дереве DOM, что и делает jQuery. Ваш узел формы не может жить частично в одном узле div и частично в другом.