As per usual I've found an incompatibility issue with my code when using IE8. I have 3 tier AJAX drop down menu system, each of which pulls its results from a MYSQL database and is working fine in all browsers. However, the third drop down then triggers a final AJAX request which works fine in all browsers and all versions (that I've tested) with the exception of IE8, which instead of changing the content of my final div just makes an error appear.
My AJAX function which is called by showResult(this.value):
function showResult(str)
{
if (str=="")
{
document.getElementById("resultChange").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("resultChange").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","checker.php?z="+str,true);
xmlhttp.send();
}
The relevant code from checker.php:
if(isset($_GET["z"])){
$z=$_GET["z"];
require_once('db connection here');
$sql3="mysql query here";
$result3 = mysql_query($sql3);
$count3 = mysql_num_rows($result3);
if($result3 > 0){
while($row3 = mysql_fetch_array($result3))
{
echo "Display this if it works"; }
}
else
{ echo 'Error';}
unset($_GET["z"]);
mysql_close();
}
And, just in case it matters, this is the DIV to be affected:
<div id="resultChange" align="left" valign="top" style="margin: 0px;">Test
</div>
The other AJAX requests on the page are identical in both their call to function and their relevant parts in the checker.php file, with the exceptions of their $_GET assignments and the ids of the divs. Oh, and they all work fine even in IE8!
I hope someone can help as I can't find anything wrong with it!
Thanks, Joe