Question

I have 10 divs on my page and each div will render its own ajax request when the page loads. I know i can make max 2 ajax requests and then i have to wait (based on the browser) before the next request gets fired. I was wondering what will be the best way to design such a page.

Should i create ajax request inside the divs so that i can pass the div as a context to the ajax reponse? something like this:

<div id="request1">
make an ajax request
</div>

<div id="request2">
make an ajax request
</div>

and so on......

is there any chance that result may get mixed up and wrong div will render the result from the different request?

–Edit–

I cannot make a single call as they all make calls to separate service and that service may or may not be available.

Answer 1

AJAX is Asynchronous, that way, if you call 10 AJAX requests using either $.get, $.post or $.ajax, those requests will fire independently without waiting for the previous ones. So unless you have a special requirements that need to avoid that, just go ahead