Question

我正在使用jquery.form.js和ajax来提交表单。我遇到的问题是，即使它没有成功（当出现错误时），ajax也会重置表单，无论它是在代码中，只是在成功后才能执行。

以下是代码：

<script>
$(document).ready(function()
{
    $('#FileUploader').on('submit', function(e)
    {
        e.preventDefault();
        $('#submit').attr('disabled', ''); // disable upload button
        //show uploading message
        $("#loadding").html('<div class="loader"><img src="images/ajax-loader.gif" alt="Please Wait"/> <br/><span>Submiting...</span></div>');
        $(this).ajaxSubmit({
            target: '#output',
            success:  afterSuccess //call function after success
        });
    });
});

function afterSuccess()
{
    $('#FileUploader').resetForm();  // reset form
    $('#submit').removeAttr('disabled'); //enable submit button
    $('#loadding').html('');
}
</script>

有人可以指出问题出在哪里。提前谢谢。

Answer 1

$(this).ajaxSubmit({
            target: '#output',
            success:  afterSuccess,
            error:error
        });

function error(response,status,xhr){
alert("error");}

将起作用，因为我在我的项目中实现了相同的概念，并且工作正常。

Answer 2

如果发生错误，您是否更改了服务器响应的http状态代码？
对于jQuery，success = 2xx http状态代码在响应中返回，error = 4xx
如果你没有改变响应的标题，对于你的jQuery代码，它总是成功的！

所以2个解决方案：

如果出现错误，您可以更改http标头代码状态。
您可以在回复中返回其他内容，并在success函数中进行检查。

其他方面：改变成功属性的定义，如后面。

success:  function () { afterSuccess(); } //call function after success

为什么？因为，如果直接声明该函数，它将在ajaxSubmit（）配置期间执行，也许它可以解决您的问题，因为在服务器的响应之前，将调用afterSuccess()。

Answer 3

如果HTTP响应代码在200-299范围内（或=== 304），则success事件将始终触发，其他任何内容都不会触发。所以我猜你的服务器端代码即使在出现问题时也会以200 OK响应。

如果服务器输出true之类的值，您可以测试该响应文本：

    $(this).ajaxSubmit({
        target: '#output',
        success:  function(response) {
            if(response == "true") {
                afterSuccess();
            }
        }
    });

即使出现错误，ajaxSubmit也会调用成功回调

3 个答案: