jQuery multiple ajax calls

Question

While making some ajax calls to two different pages , from which one continuously sends the response while other keeps loading and send's response when finished.

This is what i am doing :

$('.container').html('Please wait... Working : <span id="done">0</span></div>').fadeIn("slow");
$.post('work.php',{'p' : 'proccessImages'},function(data){
    if(data == "success"){
        $('div.container').html("Images processed!").slideDown(3000);
    }
});

Now what am i actually doing is that, when the above call is made, the "Work.php" creates some thumbnails of images which takes time, while there's another script called "done.php" which checks how many images are generated and responds with JSON , when the "Work.php" is done processing it also sends back a "success" message. Here is another function, which updates the span with id "done" with images already done!

function repeatJSON(){
    $.getJSON( "http://localhost/done.php", function( data ) {
        var items = [];
        $.each( data, function( key, val ) {
            var currentValue = $("#done").text();
            if(val !== currentValue){
                $("#counter").html("<b>"+val+"</b>").css({"color" : "black"}).hide().fadeIn("slow");
            }
            setTimeout(function(){repeatJSON()},2000);
        });
    });
}

If i execute the above repeating function in the $.post, it won't work and i won't get response from "Work.php" anymore, though script keeps working in the background.

Is there any possibility for two multiple calls? One keeps working other keeps updating ?

Answer 1

By default AJAX call is asynchronous but jquery AJAX function provides the attribute to make a synchronous call. You can set the async attribute to false to make as synchronous call and then in the success module of the Work.php you can make another request to the other file which loads the dependent data.