problems with async jquery and loops
- by Seth Vargo
I am so confused. I am trying to append portals to a page by looping through an array and calling a method I wrote called addModule(). The method gets called the right number of times (checked via an alert statement), in the correct order, but only one or two of the portals actually populate. I have a feeling its something with the loop and async, but it's easier explained with the code:
moduleList = [['weather','test'],['test']];
for(i in moduleList) {
$('#content').append('');
for(j in moduleList[i]) {
addModule(i,moduleList[i][j]); //column,name
}
}
function addModule(column,name) {
alert('adding module ' + name);
$.get('/modules/' + name.replace(' ','-') + '.php',function(data){
$('#'+column).append(data);
});
}
for each array in the main array, I append a new column, since that's what each sub-array is - a column of portals. Then I loop through that sub array and call addModule on that column and the name of that module (which works correctly). Something buggy happens in my addModule method that it only adds the first and last modules, or sometimes a middle one, or sometimes none at all... im so confused!