Ajax - simultaneous calls -or stacking requests in que

[crobinson42]

I have a site that uses an iframe and most of the sites content is navigated through the iframe and there are mostly ajax requests inside the iframe. The parent frame has an ajax request that runs every 60sec to check for new messages. Both the iframe and the parent frame use this code:

<script type="text/javascript">
function ajaxRequest(divTag,url)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  	//loading animation
	document.getElementById([divTag]).innerHTML="<image src=../../images/loading.gif></img>";
	
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById([divTag]).innerHTML=xmlhttp.responseText;
	parent.calcHeight();
    }

  }	
xmlhttp.open("GET",[url],true);
xmlhttp.send();

}
</script>

I haven't experienced it yet, but i'm concerned that this might cause errors if the user happens to click a link inside the iframe at the same time the auto ajax request runs every 60 seconds and it will jam up? I would like some input or suggestions on this if possible, thanks!

[jscheuer1]

If as you say these are on two separate pages there should be no real problems. The code is in two separate 'name spaces'. One is the window of the page containing the iframe, the other is the iframe window.

Even if they weren't, each time this function is called, it creates a new local to itself instance of the request object (xmlhttp).

Now if two or more of these were to fire off at the same time or about the same time, it would put both the server and the client (user's) computer under higher load than just one at a time would, but most system should be able to handle it.

To test it, you could do something like so in the iframe:

<a href='#' onclick="ajaxRequest('test', 'somepage.htm'); parent.ajaxRequest('test', 'someotherpage.htm'); return false;">Test</a>

Just make sure there's a div on the page in the iframe and one on the top page too with an id of 'test' and that the 'somepage.htm' and 'someotherpage.htm' files are accessible from each respective page. 'somepage' should be relative to the page in the iframe, 'someother' to the top page. You can use absolute paths, but then the presence of or lack thereof of www in the path must match the url of both the top page and the page in the iframe.

If you run this test and it works, there will be no problem. If there is a problem it might mean there's a problem, or just that I didn't explain/conceive the test properly.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

[crobinson42]

Thanks! that's a great explanation that helps me understand. I think i was concerned because the most recent problem i was having is with php sessions and IE treats the parent and the iframe as separate instances but I also know that can only handle 1 xmlhttp request at a time...or so i thought.. Thanks again!

[crobinson42]

I have a problem with this ajaxRequest() function I have. I have a form that the submit button calls 2 seperate div's to load new content via the ajaxRequest:

<input type="button" value="Add Data" onClick="ajaxRequest('div1', 'inbox.php'); ajaxRequest('div2', 'outbox.php');"> 

The problem is when you click on the button, it loads the second ajax function in the onClick event handler and the first seems to get jammed up waiting for a response.

here's my function:

function ajaxRequest(divTag,url)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  	//loading animation
	document.getElementById([divTag]).innerHTML="<image src=../images/loading.gif></img>";
	
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById([divTag]).innerHTML=xmlhttp.responseText;
	parent.calcHeight();
    }

  }	
xmlhttp.open("GET",[url],true);
xmlhttp.send();

}

[jscheuer1]

xmlhttp is an undeclared global. As soon as the second request is made, it overwrites the first. Use something a little more robust like jQuery ajax, or:

http://www.dynamicdrive.com/forums/s...3&postcount=23