Почему вы должны отправить дважды, прежде чем jQuery Validate submitHandler запущен? - PullRequest
2 голосов
/ 23 марта 2012

У меня есть ситуация, когда проверка HTML-формы с помощью jQuery Validation Plugin 1.9.0.(Я использую jQuery 1.6.4).Если форма заполнена правильно после загрузки страницы, проверка происходит при отправке.Проверка выдает сообщение об успешном завершении, но не вызывает submitHandler.SubmitHandler срабатывает только при повторном нажатии кнопки подтверждения.

Я создал симуляцию на http://jsfiddle.net/peterph/Hv3xz/1/, чтобы проиллюстрировать проблему.Может кто-нибудь сказать мне, как я могу решить эту проблему?

<form method="post" id="form">
    <input id="E_Mail" name="E_mail" title="E_mail" required="required" /><br />
    <input class="submit" type="submit" value="Send"/>
</form>

<script>
    jQuery(function($) {
        $("#form").submit(function(e) {
            var $form = $(this);
            alert('Start Validation');
            $form.validate({
                debug: false,
                focusInvalid: false,
                onfocusout: false,
                onkeyup: false,
                onclick: false,
                rules:
                {
                    E_mail: {required:true, email:true },
                },
                success: function(label) {
                    alert('succes:' + label);
                },
                submitHandler: function(form){
                    alert('start submitHandler');
                    postContent('test');
                    alert('end submitHandler');
                },
                invalidHandler: function(form, validator) {
                    alert('invalidHandler');
                },
            }).form();
            alert('end Validation');
            e.preventDefault();
        });
    });

    function postContent(postData){
        alert('postcontent: ' + postData);
    }
</script>

1 Ответ

2 голосов
/ 29 марта 2012

validate не вызывается, пока вы не отправите форму. При первом нажатии submit проверка не была применена к форме. Во второй раз он имеет.

Вы должны переместить вызов на validate вне обработчика submit:

jQuery(function ($) {
    $("#form").validate({
        debug: false,
        focusInvalid: false,
        onfocusout: false,
        onkeyup: false,
        onclick: false,
        rules:
        {
            E_mail: {required:true, email:true },
        },
        success: function(label) {
            alert('succes:' + label);
        },
        submitHandler: function(form){
            alert('start submitHandler');
            postContent('test');
            alert('end submitHandler');
        },
        invalidHandler: function(form, validator) {
            alert('invalidHandler');
        },
    });
});

И все должно работать нормально.

Обновленный пример: http://jsfiddle.net/8r47E/

...