Jquery 验证有效，但在远程验证中有错误

Question

我有 jquery 验证。除了检查遥控器外，它工作正常。似乎在提交表单后检查遥控器。

这是我的代码：

$('#m_login_signup_submit').click(function (e) {
    e.preventDefault();

    let btn = $(this);
    let form = $('#register_form');

    form.validate({
        rules: {
            fullname: {
                required: true
            },
            email: {
                required: true,
                email: true,
                remote: '/account/check-email',
            },
            password: {
                required: true
            },
            password_confirmation: {
                required: true,
                equalTo: '#register_password'
            },
            agree: {
                required: true
            }
        },

        messages:{
            email:{remote:'Email already registered'}
        },
    });

    if (form.valid()) {

        btn.addClass('m-loader m-loader--right m-loader--light').attr('disabled', true);
        form.ajaxSubmit({
            url: '/account/register',
            success: function (response, status, xhr, $form) {
                let result = $.parseJSON(response);
                if (result.status === 'success') {

                    form.clearForm();
                    form.validate().resetForm();

                }else{
                    showErrorMsg(form, 'danger', result.message);
                }
            }
        });
    }

});

如何才能让表单只有在包括远程验证在内的所有验证都通过后才提交？

Answer 1

我认为将 Ajax 放在 .validate() 方法的 submitHandler 回调中而不是在外部执行可能会更成功。 According to the docs，这是"the right place to submit a form via Ajax"。
不要将 .validate() 放在 click 处理程序中。 .validate() 方法用于初始化表单上的插件，不需要在每次单击按钮时都调用。你调用一次，按钮（必须是type="submit"）点击被插件自动捕获。

$(document).ready(function() {

    $('#register_form').validate({
        rules: {
            fullname: {
                required: true
            },
            email: {
                required: true,
                email: true,
                remote: '/account/check-email',
            },
            password: {
                required: true
            },
            password_confirmation: {
                required: true,
                equalTo: '#register_password'
            },
            agree: {
                required: true
            }
        },
        messages:{
            email:{remote:'Email already registered'}
        },
        submitHandler: function(form) {
            $('#m_login_signup_submit').addClass('m-loader m-loader--right m-loader--light').attr('disabled', true);
            $(form).ajaxSubmit({
                url: '/account/register',
                success: function (response, status, xhr, $form) {
                    let result = $.parseJSON(response);
                    if (result.status === 'success') {
                        $(form).clearForm();
                        $(form).validate().resetForm();
                    } else {
                        showErrorMsg(form, 'danger', result.message);
                    }
                }
            });
        }
    });

});

Jquery 验证有效，但在远程验证中有错误

Jquery validation is valid although have error in remote validation

jquery

jquery-validate