jQuery ajax页面重新加载

Question

We are making multiple ajax requests to "save" data in a web app, then reload the page. We have run into a situation where (since requests are made asynchronously) the page is reloaded while or before the ajax calls are completed. The simple solution to this was to make the ajax calls with the "async": false option on, forcing synchronous calls. This seems to work, however dialog box code that runs BEFORE any calls are executed delay in running.

Any advice is greatly appreciated!

Also it should be noted that putting an alert() before the reload ALLOWS the ajax requests to be made. (The alert is obviously delaying the reload long enough for the requests to successfully go through)

UPDATED with code samples:

$(".submit_button").click(function(){ 
    popupMessage();
    sendData(); //the ajax calls are all in here
    location.reload();
});


function sendData() {
    //a bunch of these:
    $.ajax({
    "dataType": "text",
    "type": "POST",
    "data": data,
    "url": url,
    "success": function (msg) {}
    }).done(function( msg ) {

    }); 
}

Answer 1

it depends on way you do your requests For example (you don't do form submit. Otherwise you need prevent form submission)

$.ajax({
   url: 'some_url',
   type:    'GET',
   data: 'var1=value1&var2=value2',
 success: function(){
   //do smth
 },
 error: function(){
   alert(w.data_error);
   document.location.reload(); 
 }
 complete: function(){ //A function to be called when the request finishes (after success and error callbacks are executed) - from jquery docs
   //do smth if you need
   document.location.reload(); 
 }
});

Take a look onto complete block