Response function not working sometimes for .ajaxSubmit()

Question

I have called .ajaxSubmit() to submit data and after saving data successfully, upon response from server, I am redirecting user to next page using JavaScript. Issue is this redirect works most of the time but for 5 to 10 percent times it just displays the server response as text in browser instead of redirecting user to next page.

UPDATE START

One strange thing that I just noticed is that the page also gets redirected to the URL of form which is being submitted using .ajaxSubmit() means the server response displayed in browser has URL of form action.

UPDATE END

Please guide what is being done wrong here, why this random behavior?

Following is the code I am using:

$(document).ready(function () {

    function showResponse(data) {
        if (data.success == false) {
            alert(data.message);
        }
        else {
            var redirect = data.redirect_to;
            window.location.replace(redirect);
        }
    }

    var options = {
        success: showResponse, // post-submit callback
        dataType: 'json'
    };

    // bind to the form's submit event
    $('#signupForm, #mobileSignupForm').submit(function (e) {
        // inside event callbacks 'this' is the DOM element so we first
        // wrap it in a jQuery object and then invoke ajaxSubmit
        $(this).ajaxSubmit(options);

        e.preventDefault();

        // !!! Important !!!
        // always return false to prevent standard browser submit and page navigation
        return false;

    });
});

Answer 1

It is quite possible that in server side you are not getting proper format response in this 5-10 percent times. Try to debug and check.