ajax complete function invoking after dom is ready

Question

I need to make an ajax request and then process some data returned from server. I'd like to make this request earlier then document is ready. But i will be able to process data only after document is ready. I've got an idea to make something like this:

$.when($(document).ready(),
       $.ajax(/*some request*/)).done(function(){//processing data from the server});

How will it work? or is there any other options to get the result i want

Answer 1

Try using: $( document ).ajaxComplete(function() {}

Answer 2

Without using async helper libraries, You can use some flags and a helper function, not the most elegant but it works

var docReady = false;
var responseReady = false;
var tryEvaluateResponse = function() { 
    if(docReady && responseReady) {/*processing data from the server*/}
};
$(document).ready(function() {
    docReady = true;
    tryEvaluateResponse();
});
$.ajax(/*some request*/)).done(function() {
    responseReady = true; 
    tryEvaluateResponse()
});

Answer 3

No, this won't work, as $(document).ready() doesn't return a promise. You can however do

var request = $.ajax(/*some request*/);
$(document).ready(function() {
    request.done(function(){
        //processing data from the server
    });
});