Question

In Internet Explorer 10 only, I get an error transforming XML returned from an AJAX response:

Object doesn’t support property or method ‘transformNode’

Here is my code:

function transformXML(xmlUrl, xsl) {
    $.ajax({
        type: 'GET',
        url: xmlUrl,
        success: function (xml, status, xhr) {
            // cross-browser logic omitted for simplicity
            xml.transformNode(xsl);
        },
        dataType: 'xml'
    });
}

This works in IE7 – IE9. What’s wrong with IE10?

Answer 1

This is because, as of IE 10, XMLHttpRequest.responseXML returns a “native XML document” by default instead of an MSXML document.

You can coerce the XMLHttpRequest object to return an MSXML object instead by setting the responseType property to "msxml-document". Unfortunately, this breaks in Google Chrome, so you need to wrap it in a try/catch.

Assign it during jQuery’s beforeSend function:

function transformXML(xmlUrl, xsl) {
    $.ajax({
        type: 'GET',
        url: xmlUrl,
        beforeSend: function (xhr, settings) {
            try { xhr.responseType = "msxml-document"; } catch(err){}
        },
        success: function (xml, status, xhr) {
            // cross-browser logic omitted for simplicity
            xml.transformNode(xsl);
        },
        dataType: 'xml'
    });
}

Note: Don’t try to use the xhrFields setting – jQuery does not handle the error thrown by Chrome (and other browsers?) when attempting to set the responseType to an invalid value. That needs to be wrapped in a try/catch, and the best way to do that is in the beforeSend function.