Problem with IE8 using AJAX

Question

Hello,

Can anyone help me with this IE8 problem, my app is work fine in FF but Ajax Functionality is not working in IE8

function createXMLHttpRequest()
{
  if (window.XMLHttpRequest)
  {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    return new XMLHttpRequest();
  }

  if (window.ActiveXObject)
  {
    // code for IE6, IE5
    return new ActiveXObject("Microsoft.XMLHTTP");
  }

  return null;
}

placed in js/ajax.js

this is the error i'm facing

Object doesn't support this property or method
ajax.js
Code:0
Line : 6
Char : 5

Infact the same is working perfect in FF

Can anyone guide me whats the problem with my code ?

Thanks in advance

Answer 1

Consider using a function such as this:

 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;
 };

Which tests for the new XMLHttp plugin in ActiveX, or defaults to the old one.

Update: Try this instead:

function createXMLHttpRequest()
{
  var xmlhttp, bComplete = false;
  try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
  catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
  catch (e) { try { xmlhttp = new XMLHttpRequest(); }
  catch (e) { xmlhttp = false; }}}
  if (!xmlhttp) return null;
  this.connect = function(sURL, sMethod, sVars, fnDone)
  {
    if (!xmlhttp) return false;
    bComplete = false;
    sMethod = sMethod.toUpperCase();

    try {
      if (sMethod == "GET")
      {
        xmlhttp.open(sMethod, sURL+"?"+sVars, true);
        sVars = "";
      }
      else
      {
        xmlhttp.open(sMethod, sURL, true);
        xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
        xmlhttp.setRequestHeader("Content-Type",
          "application/x-www-form-urlencoded");
      }
      xmlhttp.onreadystatechange = function(){
        if (xmlhttp.readyState == 4 && !bComplete)
        {
          bComplete = true;
          fnDone(xmlhttp);
        }};
      xmlhttp.send(sVars);
    }
    catch(z) { return false; }
    return true;
  };
  return this;
}

function getModIndex(val) {
    var divEle = "IndexDiv" + val;
    var request = createXMLHttpRequest();

    if ( !request ) { 
    alert( request )
    return false
    }

    var callback = function( oXML ) {
    document.getElementById( divEle ).innerHTML = oXML.responseText;
    }

    request.connect(
    '../ajax/ajax-GetIndex.php',
    'POST',
    'id=' + val,
    callback
    );
}

Answer 2

Can you try this code:

function createXMLHttpRequest() { 
  if (typeof XMLHttpRequest != "undefined") { 
    return new XMLHttpRequest();
  } else if (typeof ActiveXObject != "undefined") { 
    return new ActiveXObject("Microsoft.XMLHTTP"); 
  } else { 
    throw new Error("XMLHttpRequest not supported");
}

Answer 3

straight out of jQuery:

return( window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest( ) );

Answer 4

You can try UpperLower case for Microsoft.XMLHTTP i.e. (Microsoft.XMLHttp) IE8 is exraordinarily Case Sensitive

Answer 5

I was having the same problem -- reloading the page seemed to eliminate the error, but visiting the page first time I got the same error as luvboy.

I think the underlying problem has something to do with IE 8 having issues with a first-time load of the XMLHttpRequest function. I gave up searching for the real reason why, but it seems that others have had similar quirks: http://www.daniweb.com/forums/thread299941.html

Dan Beam's answer seems to work well enough and it's way less code -- it checks for the ActiveXObject first, which IE seems to be more content with.