jQuery表单Validator:需要提交两次

时间:2015-02-20 17:07:28

标签: javascript jquery ajax forms validation

我正在尝试从Jquery实现Form Validator。 onSuccess,我做了一个ajax-call。

我想知道为什么在验证开始工作之前我需要按两次提交按钮?

脚本位于包含的单独文件中。如果我在页面本身上调用$ .validation(),它会立即生效。

这是js-code:

$(document).ready(function () {
    $("#frmNews").submit(function (e) {
        e.preventDefault();

        // -- form validation
        $.validate({
            language: nederlands,
            onError: function () {
                // -- show alert
                $("#feedback-error").removeClass('hidden');
                // -- back to top
                $("html, body").animate({scrollTop: 0}, "slow");
            },
            onSuccess: function () {
                // -- show preloader
                $('body').toggleClass('loaded');

                $.ajax({
                    type: 'POST',
                    url: '/ajax',
                    data: $("#frmNews").serialize(),
                    success: function (data) {
                        var result = $.trim(data);
                        if (result == 'success') {
                            // -- show alert
                            $("#feedback-success").removeClass("hidden");
                            // -- clear all fields
                            emptyAllInputFields("#frmNews");
                            // -- back to top
                            $("html, body").animate({scrollTop: 0}, "slow");
                            // -- hide preloader
                            $('body').toggleClass('loaded');
                        }
                        else if (result == 'error_saving') {
                            // -- alert
                            $("#feedback-error").removeClass("hidden");
                            // -- back to top
                            $("html, body").animate({scrollTop: 0}, "slow");
                            // -- hide preloader
                            $('body').toggleClass('loaded');
                        }
                    }
                });
            }
        });
    });
});

1 个答案:

答案 0 :(得分:2)

正如@epascarello在评论部分中所提到的,您应该将提交处理程序的验证放在之外。

您的脚本中实际发生了什么 - 按下提交按钮后,$.validate() 。然后它在下一次点击时处理验证(最终是AJAX)。

$("#frmNews").submit(function (e) {
    e.preventDefault();
});

$.validate({
    // ... your validation ...
});