Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

XMLHttpRequest won't work in IE 7/8 but works in other browsers

I've developed a web application that works well on chrome and firefox. However when it came to testing time and it doesn't work properly in IE. It just doesn't seem to actually get the request?

here's the Javascript code:

function createXMLHttpRequest() {
    var xmlhttp = false;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else if(window.ActiveXObject) {
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                xmlhttp = false;
            }
        }
    }
    return xmlhttp;
};




function checkForData(){

    var target = document.getElementById('accordion');
    var loading = document.getElementById('controls');

    var xhr = createXMLHttpRequest();


    loading.innerHTML = '<img src="../images/loading.gif" width=20 height=20 />Querying the Database';

    xhr.open('GET','getData.php',true);
    xhr.send(null); 

    xhr.onload = function(){
        loading.innerHTML = '<a href="../classes/php/print.php" />Print Report</a><br/><br/><a href="../index.php" />HomePage</a><br/><a href="../classes/php/actionedClass.php" />Refresh</a><br/><a href="../classes/php/logout.php" />Logout</a><br/>';

        target.innerHTML = xhr.responseText;
//      addPrettyness();

    };
    xhr.onerror = function (){
        target.innerHTML = 'Failed :(';
    };

}

function addPrettyness(){
    $(function() {
                    var stop = false;
                    $( "#accordion h3" ).click(function( event ) {
                        if ( stop ) {
                            event.stopImmediatePropagation();
                            event.preventDefault();
                            stop = false;
                        }
                    });
                    $( "#accordion" )
                            .accordion({
                                collapsible: true,
                                header: "> div > h3"});
    });
}

function checkAgain(){
    setInterval('checkForData()',30000);            //Every 30 seconds run the check for new data script

}


function changeAction(action, actionChangeId){

    xhr = new XMLHttpRequest();

    if(action == 0){


        var loading = document.getElementById('controls');
        loading.innerHTML = '<img src="../images/loading.gif" width=20 height=20 />Sending to the Database';        

        xhr.open('GET','../classes/php/actionNo.php?actionChangeId='+actionChangeId,true);
        xhr.send();

        xhr.onload = function(){
            checkForData();
        };

        xhr.onerror = function(){
            alert('Failed to change action... Try again please!');
        };

    }else if(action == 1){
        xhr = new XMLHttpRequest();

        var loading = document.getElementById('controls');
        loading.innerHTML = '<img src="../images/loading.gif" width=20 height=20 />Sending to the Database';        


        xhr.open('GET','../classes/php/actionYes.php?actionChangeId='+actionChangeId,true);
        xhr.send();

        xhr.onload = function(){
            checkForData();
        };

        xhr.onerror = function(){
            alert('Failed to change action... Try again please!');
        };
    }
}

function startEngine(){
    checkForData();
    //checkAgain();

}


window.onload = startEngine;

and the .php file it requests from echos back a string result to the javascript.

like image 370
Ash Avatar asked Mar 24 '11 11:03

Ash


2 Answers

As mentioned here, Internet Explorer supports the onload event of the XMLHttpRequest object only since version 9.

So, for IE 8 and below, you can do it in the old fashioned way:

xhr.onreadystatechange = function()
{
    //ready?
    if (xhr.readyState != 4)
        return false;

    //get status:
    var status = xhr.status;

    //maybe not successful?
    if (status != 200) {
        alert("AJAX: server status " + status);
        return false;
    }

    //Got result. All is good.
    loading.innerHTML = '<a href="../classes/php/print.php" />Print Report</a>' + 
        '<br/><br/><a href="../index.php" />HomePage</a><br/>' + 
        '<a href="../classes/php/actionedClass.php" />Refresh</a><br/>' + 
        '<a href="../classes/php/logout.php" />Logout</a><br/>';
    target.innerHTML = xhr.responseText;

    return true;
}
like image 52
Shadow Wizard Hates Omicron Avatar answered Sep 18 '22 23:09

Shadow Wizard Hates Omicron


From Wikipedia:

if (typeof XMLHttpRequest == "undefined")
  XMLHttpRequest = function () {
    try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); }
      catch (e) {}
    try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
      catch (e) {}
    try { return new ActiveXObject("Msxml2.XMLHTTP"); }
      catch (e) {}
    //Microsoft.XMLHTTP points to Msxml2.XMLHTTP.3.0 and is redundant
    throw new Error("This browser does not support XMLHttpRequest.");
  };
like image 25
vbence Avatar answered Sep 17 '22 23:09

vbence