problems with async jquery and loops

Posted by Seth Vargo on Stack Overflow See other posts from Stack Overflow or by Seth Vargo
Published on 2010-06-13T05:58:13Z Indexed on 2010/06/13 6:02 UTC
Read the original article Hit count: 251

Filed under:
|
|
|

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!

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about arrays