Ajax .done() don't work together for me

问题

I have a very strange situation. I have an AJAX function which sends form data to a php codeigniter controller, on json response, it has to deal with the response. first part is working, but later part, which is a .done() function, doesn't work, no matter what I try. here is my script:

var validator = $('#register-company-form').validate({
    rules: {
        title: {
            required: true,
            valueNotEquals: 0
        },
        /* rules here */
    },
    highlight: function (element) {
        $(element).closest('.form-field').addClass('error-field');
    },
    unhighlight: function (element){
        $(element).closest('.form-field').removeClass('error-field');
    },
    errorPlacement: function(error, element) {},
    submitHandler: function(form) {
        var formData = new FormData($(form)[0]);
        $.ajax({
            type: $(form).attr('method'),
            url: $(form).attr('action'),
            data: formData,
            dataType: 'json',
            cache: false,
            contentType: false,
            processData: false
        })
        .done(function (response) {
            $(".form-field").removeClass("error-field");
            $(".item-exists").hide();

            if(response.Response == 401) {
                 $("#company_email").closest('.form-field').addClass('error-field');
                 $("#company_email").closest(".form-field").find(".item-exists").show();
            } else if(response.Response == 402) {
                $("#personal_email").closest('.form-field').addClass('error-field');
                $("#personal_email").closest(".form-field").find(".item-exists").show();
            } else if(response.Response == 403) {
                $("#user_name").closest('.form-field').addClass('error-field');
                $("#user_name").closest(".form-field").find(".item-exists").show();
            } else if(response.Response == 200){
                /* load my view */
            }
        });
        return false;
    }
});

My PHP script returns following JSON response:

{"Response":200,"Data":null,"Message":null}

After getting this response, my .done() function is supposed to act according to it and load a page, which it is not. I have tried putting console.log() and alert() into it, but now its clear its not responding. Is there any other way to do this or any correction in code? Please note that the same code really worked fine on another server. This has happened after migration.

Thank you so much for the help!

回答1:

Thank you so much for your Kind information @DFreind and @JonathanLonowski, with your hints, I finally figured out this problem which took me almost 3 days. Actually when I looked closely at the html produced by PHP, it said: 1 {"Response":200,"Data":null,"Message":null}

This '1' before the JSON string was generating cannot modify headers error! After lots of efforts, I just saw a plain goddamn '1' just before opening <?php tag on first line in my controller. Removing this '1' worked like a charm, all errors gone, life saved, dosing in heaven now :-)

Indication for researchers: Please install Firebug if you are facing similar errors and always look into response headers, try experimenting. Most of the time PHP errors mess with your output. In my case, 'headers already sent' error generated because before php started its output, html came in. Watch out for any echo() or set_cookie() functions as well!

Thanks all of you StackOverflowish geeks :)

来源：https://stackoverflow.com/questions/33321037/ajax-done-dont-work-together-for-me

标签

javascript

jquery

ajax

jquery-callback