Question

从我的api返回错误（例如“未知用户”）时，如果不单击两次就无法重新提交表单。我希望用户能够重新提交数据，但是除非单击两次，否则表单不会提交。第一次单击将删除错误警报，第二次单击将重新提交表单。仅供参考：Using jquery.validate.js

var validator = $('#form1').validate({
    submitHandler: function (form) {
        $('#login').attr('disabled', 'disabled');
        $.ajax({
            xhrFields: {withCredentials: true},
            type: "POST",
            dataType: "json",
            data: {
                login: 1,
                UserName: $('#UserName').val(),
                Password: $('#Password').val()
            },
            url: apiBase + 'login.php',
            success: function (resp) {
                window.location.replace("index.php");
            },
            error: function (resp) {
                err = JSON.parse(resp.responseText);
                $('#err').toggleClass('hidden').text(err.alert);
                $('#login').removeAttr('disabled');
            }
        });
    }
});

Answer 1

首先，要禁用表单的“提交”按钮，可以使用

onsubmit: false option of the validator ( $("#form1").validate({
  onsubmit: false
}); )

。其次，为什么要将新的验证器传递给“验证器”变量？第三，验证表单后的submitHandler函数triggers并替换了默认的Submit按钮，这使我认为$('#login').attr('disabled', 'disabled');有点过分。

此外，关于您两次单击按钮以使其起作用的事实，可能是“递归过多”的情况。请参阅：https://jqueryvalidation.org/documentation/递归过多。

最后，我认为您不应该编写自己的ajax调用，而应将$(form).ajaxSubmit();函数与callback选项对象一起使用来处理响应。有关更多信息，请参阅：http://malsup.com/jquery/form/#options-object。

Ajax调用返回错误后重新提交表单

1 个答案: