Hi everyone,

I have a function that loops through a list of objects, and for each one makes an Ajax request to load an XML file, and fill a couple of the objects variables with elements from that XML file. The problem is that when execute, the function only fills one or two of the objects. I am assuming this has something to do with the function being called multiple times in a row and not having a chance to finish the previous call. If this is the case, is there a way to force the code to pause while it waits for the previous one to execute fully?

Code:
var oObjects = [
  {
    name:'Title1',
    image:'Title1.png',
    xml: 'Title1.xml',
    img: '',
    tbl: '',
    style: ''
  },
  {
    name:'Title2',
    image:'Title2.png', 
    xml: 'Title2.xml',
    img: '',
    tbl: '',
    style: ''
  }
];

var http_request = false;

function loadXML(iObj)
{
  http_request = false;

  if (window.XMLHttpRequest)
  {
    http_request = new XMLHttpRequest();
  }
  else if (window.ActiveXObject)
  {
    try
    {
      http_request = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    {
      try
      {
        http_request = new ActiveXObject("Microsoft.XMLHTTP");
      }
      catch (e) {}
    }
  }

  if (!http_request)
  {
    alert('Cannot create an XMLHTTP instance');
    return false;
  }

  http_request.onreadystatechange = function() { fillXMLdata(iObj) };
  http_request.open('GET', oObjects[iObj].xml, true);
  http_request.send(null);

  return true;
}

function fillXMLdata(n)
{
  if (http_request.readyState == 4)
  {
    if(http_request.status == 200 || http_request.status == 0) // http_request.status == 0 for testing locally - remove before deployment.
    {
      var xmlObj = http_request.responseXML;

      var t = xmlObj.getElementsByTagName("data");
      oObjects[n].tbl = t[0].childNodes[0].nodeValue;
      var s = xmlObj.getElementsByTagName("styles");
      oObjects[n].style = s[0].childNodes[0].nodeValue;
    }
  }
}

function run() // Entry point
{
  for (var i = 0; i < oObjects.length; i++)
  {
    loadXML(i);
  }

  for (var x = 0; x < oObjects.length; x++)
  {
    alert('oObjects[' + x + '] Loaded:\n ' + oObjects[x].style);
  }
}
In my real code there could be 100+ objects. When it loops through and displays the styles, it is only showing up for the last one when run locally. If run from the server, it might show one more in the middle somewhere.

I would greatly appreciate any advice.

Kind regards,
Jordan