Multiple requests with $.ajax, synchronously

Question

I am making a system, and in it I need to send several data to the server, basically synchronize an array of objects on a server via json using javascript, until then there is no problem, however the request is $.ajax, which is asynchronous, and so, I have no way to control the data afterwards, nor save the data at the end of the execution of all requests.

I have done with a for, and found on the net, first that could use async:true, however, I also saw that this function has been deprecated, so you should use Promise or callback, however both could not implement, there is some example of how I can do this?

Edited to clarify the problem

Minuting the problem, it consists of a repetition of ajax calls to a server where each object in the array is a registered object in the service, however, at the end of all calls, I save in the localstorage the whole array, this array has a certain consistency, since it is an array of data that may or may not already be in the database, so I use id (provided by the database) to find out if the object is registered, if there is id in the object, then it is in the service.

But back to the main thing, what happens is that when you send a data to the server, the asynchronous call of $.ajax, if you put it so that in each success the data is saved, this results in that in some cases, the end result is information with and without the id. resulting in unforeseen behavior. this pq, the calls ajax, they for being asynchronous, do not end in series, and in parallel being that each one at its time.

It’s not just information, in case someone has a technique that solves the problem, I guarantee that several developers will be grateful, of course, I much more.

Answer 1

Synchronous Ajax (Sjax) is being discontinued by browsers (not by jQuery, this is "consequence") and will probably be removed, what you need is to learn to use callback, Promise is optional.

In Javascript we almost always use callback, until the click on an element that triggers an event is a callback.

$.ajax, which is asynchronous, and therefore, I have no way to control the data afterwards, nor save the data at the end of the execution of all requests.

No, you’re misunderstanding, the request does not occur "together", it occurs in parallel, but is only delivered after the readyState is equal to 4, by the time you get to 4 the request will already be finished, I think maybe you have not understood the difference of back-end and front-end, are different layers, different locations.

I can’t control the data after

I don’t understand "control", maybe you want to popular an HTML element, for example:

$.ajax({
    url: "pagina.php" //Sua página
}).done(function( data ) {
    $("query para o elemento html").html(data);
}).fail(function (erro) {
    console.log("Houve um erro na requisição", erro);
});

If returning a Json jQuery is smart (it usually has to have the Content-Type set) and then detects assuming it returns something like:

[
    {"foo": "valor 1"}, { "bar": "valor 2" }
]

Ajax should look like this:

$.ajax({
    url: "pagina.php" //Sua página
}).done(function( data ) {
    var target = $("query para o elemento html");
    target.html(""); //Apaga o conteudo do "inner" atual

    for (var k in data) {
        //Adiciona os elementos
        $("<p></p>").html(k + ": " + data[v]);
    }
}).fail(function (erro) {
    console.log("Houve um erro na requisição", erro);
});

Documentation: http://api.jquery.com/jquery.ajax/