Synchronous ajax requests the page hang, how to fix?

Question

Synchronous ajax requests the page hang, how to fix?

Use Ajax to get some data from the server, if successful, the query process them and give callback function, where again, doing some manipulation. The request is sent synchronously as it is in a loop and goes 4-10 times in a row to get different data. But the problem is that while the work requests, the page is completely blocked. From here the question: either how to perform synchronous requests without blocking the page, or how to make the queries async, but obtaining information, now if you do requests instead of asynchronous data in callback function comes up undefined, as it is called before the response from the server.
Here is the query itself:

var jqxhr = $.ajax({
 type: "POST",
 url: "/mycontroller/myaction",
 dataType: "json",
 async: false,
 cache: true,
 data: {data : mydata},
 error: function(event){
 console.log("fail"); 
 return callback(false);
},
 success: function(event){
console.log("ok");
 //Here am processing the data using the data received from the server
 return callback(event);
}
 });

dora_Schinner asked July 9th 19 at 13:42

More answers about "Synchronous ajax requests the page hang, how to fix?"

1 answer

Rex.Bayer90 answered on · Answer 1 · 2019-07-09T13:44:50.989Z

You can see not quite understand the principle of operation of Korbakov. Because they are invoked asynchronously, then the return is not applicable there. You need to call the next step, like this:

$.ajax({
 success: function(data){
console.log("ok");
 //Here am processing the data using the data received from the server
nextStep(data);
}
});

function nextStep (data) {
 // here your data will be available
}