Question

我想进行ajax调用，然后等待来自ajax调用的响应（直到那时停止表单提交），然后根据我得到的ajax响应发布表单。此问题基于Make ajax call and then submit form。因此，在下面的脚本之后，一切正常，但我失去了客户端验证。我可以进行ajax调用并仍然尊重客户端验证吗？

@section scripts {
    <script>
        var canSubmit = false;
        $('form').submit(function (e) {
            if (!canSubmit) {
                e.preventDefault();
                var data = $('form').serialize();
                var url = $(this).data('url');
                $.ajax({
                    url: url,
                    type: 'POST',
                    data: data,
                    success: function (response) {
                        if (response.hasPreviousRequest) {
                            if (confirm("You've already applied for this job. Apply again?")) {
                                canSubmit = true;
                                $('form').submit();
                            }
                        }
                        else {
                            canSubmit = true;
                            $('form').submit();
                        }
                    },
                    error: function () {
                        alert("error");
                    }
                });
            }
        });
    </script>
}

P.S：请注意，一旦我删除ajax调用，客户端验证就会开始正常工作。有人可以解释一下这种行为吗？

Answer 1

您需要在表单元素上调用.valid()方法（如果没有，则取消ajax调用）

$('form').submit(function (e) {
    if (!$(this).valid()) {
        return // exit
    }
    if (!canSubmit) {
        ....

如何在进行ajax调用时尊重客户端验证

1 个答案: