Search code examples
phpjavascriptajaxfunctioninternet-explorer-6

Which part of my code isn't supported by IE 6


I am trying to load a php file into a div via ajax. it works fine in all browsers but IE6 (It does not load the php file). I have a mandate that it needs to work in IE6 too. Please suggest corrections.

My index.php file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<script type="text/javascript">
window.onload = function(){
document.getElementById("aside").innerHTML="<img src='loadingImage.gif'>";
if(XMLHttpRequest) var x = new XMLHttpRequest();
else var x = new ActiveXObject("Microsoft.XMLHTTP");
x.open("GET", "other_content_1.php", true);
x.send("");
x.onreadystatechange = function(){
    if(x.readyState == 4){
        if(x.status==200) document.getElementById("aside").innerHTML = x.responseText;
        else document.getElementById("aside").innerHTML = "Error loading document";
        }
    }
} 
</script>
</head>

<body>
<div id="aside">This is other content</div>
</body>
</html>

My other_content_1.php file:

<div id='other-content-1'>
<?php echo 'This text is loading via php command'; ?>
</div>

Solution

  • The IE6 throws javascript error on this line:

    if(XMLHttpRequest)
    

    Here is the code that works on IE6 (and probably on IE5.5 too):

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Test</title>
    <script type="text/javascript">
    window.onload = function(){
    
        document.getElementById("aside").innerHTML="<img src='loadingImage.gif'>";
    
        var x = null;
    
        if (window.XMLHttpRequest) {
            var x = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            var x = new ActiveXObject('MSXML2.XMLHTTP.3.0');
        } else {
            // fallback
        }
    
        x.open("GET", "other_content_1.php", true);
        x.send("");
        x.onreadystatechange = function() {
    
            if(x.readyState == 4) {
                if(x.status==200) 
                    document.getElementById("aside").innerHTML = x.responseText;
                else 
                    document.getElementById("aside").innerHTML = "Error loading document";
            }
        }
    } 
    </script>
    </head>
    
    <body>
    <div id="aside">This is other content</div>
    </body>
    </html>