javascript - ajaxSubmit calls the success callback even when there is an error - Stack Overflow

admin管理员组

文章数量:1389817

I'm using jquery.form.js and ajax to submit my forms. The problem I have is even when it's not on success (when there is an error) also the ajax is resetting the form no matter it is in code only to do it on after success.

Here is the code:

<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>

Can someone point out where is the problem. Thanks in advance.

I'm using jquery.form.js and ajax to submit my forms. The problem I have is even when it's not on success (when there is an error) also the ajax is resetting the form no matter it is in code only to do it on after success.

Here is the code:

<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>

Can someone point out where is the problem. Thanks in advance.

• javascript
• ajax
• jquery

Share Improve this question Follow edited Jun 17, 2013 at 8:01 user447356 asked Jun 17, 2013 at 7:58 maxlkmaxlk 1,05766 gold badges1818 silver badges3535 bronze badges 1

• How can you tell there is error? You don't seem to handle any error event. – user447356 Commented Jun 17, 2013 at 8:02

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

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

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

will work as i had implemented same concept in my project and it works fine.

Did you change the http status code of the server response if an error occuring ?
For jQuery, success = 2xx http status code return in the response and error = 4xx
If you didn't change the header of response, for your jQuery code, it's always a success!!!

So 2 solutions :

1. You can change the http header code status if it's an error.
2. You can return a different content in response and check it in your success function.

Other point: change the definition of the success property like behind.

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

Why ? Because, if you declare directly the function, it will be execute during the ajaxSubmit() configuration, maybe it's solve your problem, because before the response of the server, afterSuccess() will be called.

The success event will always fire if the HTTP response code is in the 200-299 range (or === 304), anything else and it won't fire. So I'm guessing that your server side code responds with 200 OK even when there is a problem.

If the server outputs a value such as true you can test the response text for that:

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

本文标签： javascriptajaxSubmit calls the success callback even when there is an errorStack Overflow