javascript - Issue with multiple Synchronous ajax calls -

i need fire synchronous ajax calls consecutively.

after each call i'm updating dom element.

now issue occurs,the element gets updated when calls finished.

var xmlhttp = new xmlhttprequest(); xmlhttp.open("get", "analysis.py?id="+id, false); xmlhttp.send(); document.getelementbyid("res").innerhtml = "done id "+id; id+=10; xmlhttp = new xmlhttprequest(); xmlhttp.open("get", "analysis.py?id="+id, false); xmlhttp.send(); document.getelementbyid("res").innerhtml = document.getelementbyid("res").innerhtml+"done id "+id; 

the element dom shows : done id 1done id 11 @ once instead of 1 after expected i.e. element directly updated @ end of both calls.

edit 1: hi guys, found issue code. following code runs first ajax, after ajax calls seem run work defined in analysis.py not done these calls.

var total = %d;     function filldatabase(){     var id = 1;     callajax(id); } function callajax(id){     $.ajax({           url: "analysis.py?id="+id,           context: document.body     }).done(function() {           $("#progress").html(math.floor(((id/(total-5))*100))+"%%");           $("#pbar").css("width", ((id/(total-5))*100) + "%%");           if(id<=1296){                 callajax(id+10);           }           else{             $("#res").html("completed. redirecting in 5 seconds...<meta http-equiv='refresh' content='5;url=get_comment.py'>");           }       });     } 

solved calling next ajax in previous one's callback.