Here's my need:

I am currently calling an init function that is fired up when the page loads. The function initializes HTML drop downs from data in a MySQL database.

As of now it utilizes the XMLHttpRequest object synchronously and it works just fine. A request is sent, PHP returns an XML list of labels from MySQL, and JS parses the XML to create the HTML drop downs.

It's called like this:

var labelsDropdown1=getLabelDropdown("label1");
var labelsDropdown2=getLabelDropdown("label2");

Now the variables are set to something like the following:

labelsDropdown1="<select><option>item 1</option><option>item 2</option></select>";

This way I can dynamically add this drop down content later on, without having the latency effect the work flow.

The only problem is the initialization process could be faster with asynchronous calls and with asynchronous calls I can use the readystatechange event to update a "Loading" progress bar.

Essentially what I want to happen is for an array of asynchronous calls to create the drop down variables inside the init function without exiting until they are all done being created. Once the different labels have been created the init function can be completed.

I know all of this is a tall order, but I was hoping some one could at least point me in the right direction.

Thanks in advance