JQuery ajax requests don’t work with IE8 and IE9.

With the changing web world we are seeing an increase in the need for HTTP Requests to return data from some sort of API. Chrome, Firefox, and Safari all work great in this regard because they support Javascript‘s XMLHttpRequest. IE10 and later now also support that natively, and it is about time. Although we still have a need to provide support for IE8 and IE9 users unfortunately. WIth this method, I have been able to get IE9 to work, although IE8 still has issues if it is a cross domain request. Many sites use JQuery, and JQuery has no support for the required methods for IE8 and IE9 to handle this. They require XDomainRequest.

So what you have to do is check to see if the browser supports XMLHttpRequest like:

if (typeof new XMLHttpRequest().responseType != 'string' && window.XDomainRequest) { //IE8 and IE9
  var xdr = new XDomainRequest();
  xdr.open("post", "http://yoururl");
  xdr.onload = function () {
    var data = jQuery.parseJSON(xdr.responseText);
    console.log(data);
  };

  xdr.onprogress = function () { };
  xdr.ontimeout = function () { };
  xdr.onerror = function () { };

  setTimeout(function () {
    xdr.send("requestdata");
  });
} else {
  $.ajax({
    url: "http://yoururl",
    data: "requestdata",
    type: "POST",
    async: true,
    dataType: "json",
    success: function (data) {
      console.log(data);
    },
    error: function (data) {
      console.log(data);
    }
  });
}

Obviously swap out your URL and your request data. Hopefully this example gives you the direction you need in your project.