Trigger Ajax calls before javascript code

Question

In my current code I'm filling the Object arr with ajax calls. After the calls, I would like to sort them. My code to fill the arr is working fine but the sequence of the code is not what I want to.

In Debug mode I see he first try to sort the empty Arr and afterwards the ajax call is running.

Is there a way to say first run the whole Ajax script and after filling run the sort part?

Code:

//Sortering
var arr = {};
var key = "";
var teller = 0;
for (var i = 0; i < schedule_id.length; i++) {

    //Ajax call maken
    $.ajax({
        url: "http://api.viewer.zmags.com/schedules/" + schedule_id[i] + "?key=" + api_key
    })

    .done(function(data) {

        //Check publicatieID is not null
        if (undefined === data.scheduleEntries[default_pub] || null === data.scheduleEntries[default_pub]) {} else {

            var key = schedule_id[teller];
            //loopen doorheen resultaat call
            $.each(data.scheduleEntries, function(index, entry) {
                arr[key] = entry.startDate;
            })
        }
        teller++;
    })
}

//////////////////////////////////////////////////////////////////////////
//I want this part after the arr is filled
var timeArray = [],
    newObj = {};

for (var key in arr) {
    timeArray.push([key, arr[key]]);
}

timeArray.sort(function(a, b) {
    return new Date(a[1]) - new Date(b[1])
});
//console.log(timeArray);


var j = 0,
    k = 1;


for (var i = 0; i < timeArray.length; i++) {
    newObj[timeArray[i][j]] = new Date(timeArray[i][k]);
}

Ok, so put the "I want this part" portion inside your `done()` handler maybe? — JLRishe, Feb 19 '15 at 07:58
I can't because I need to first fills the Arr variabelen in the loop and later sort it. The .done() part is just one call of the 10, so it need to be after the loop. — Timvdb92, Feb 19 '15 at 08:02
Ok, it's very hard to understand what your code is supposed to be doing when it's not properly indented. — JLRishe, Feb 19 '15 at 08:21

score 0 · Answer 1 · answered Feb 20 '15 at 11:21

Cannot add comment to the main thread, according to you comment, it looks like you are having some synchronization issue, so i would suggest you to spend some a while on this (jquery deferred object), i suppose it maybe the solution for your question

score -1 · Accepted Answer · answered Feb 19 '15 at 08:00

-1

set async to false

$.ajax({ url: "http://api.viewer.zmags.com/schedules/" + schedule_id[i] + "?key=" + api_key, async: false })
move your code to the done function

answered Feb 19 '15 at 08:00

Ariex

76
1
10

Please don't suggest setting async to false. That's just a lazy workaround. – JLRishe Feb 19 '15 at 08:01
@Timvdb92 For goodness' sake, don't use `async: false` just because it's easy. Learn to do async programming correctly. https://github.com/getify/You-Dont-Know-JS/tree/master/async%20%26%20performance – JLRishe Feb 19 '15 at 08:18
Is it possible that async not working in IE8? My code works fine in Chrome but is not working in IE8 :s – Timvdb92 Feb 19 '15 at 08:25
@Timvdb92 What version of jQuery are you using? jQuery 2.x only supports IE9+. – JLRishe Feb 19 '15 at 08:28
@JLRishe use $ when and push all ajax calls into a queue check out this answer http://stackoverflow.com/questions/28578297/javascript-function-inside-jquery-foreach-loop-doesnt-wait-for-response/28578795#28578795 – Mhammad Chehab Feb 19 '15 at 08:46

Trigger Ajax calls before javascript code

2 Answers2