jQuery xmlParse not working in IE

Question

I am building a photo slider in JavaScript and jQuery. It works perfectly in chrome, but not in IE6 where I know most of my clients would view it.

I have this function:

function getFacebookPhotos(photoCount, pageId) {
    var picsUrl = "http://api.facebook.com/method/fql.query?query=SELECT%20src_big,%20src_big_height,%20src_big_width%20FROM%20photo%20WHERE%20pid%20IN%20(SELECT%20pid%20FROM%20photo_tag%20WHERE%20subject='243117879034102')%20OR%20pid%20IN%20(SELECT%20pid%20FROM%20photo%20WHERE%20aid%20IN%20(SELECT%20aid%20FROM%20album%20WHERE%20owner='" + pageId + "'%20AND%20type!='profile'))";

    var responseText = $.ajax({
        url: picsUrl,
        async: false,
        dataType: "xml",
        success: function(text) {
            responseText = text;
        }
    }).responseText;
    var xmlDoc = $.parseXML(responseText);
    var $xml = $(xmlDoc);
    var $photos = $xml.find("photo");
    var resultantPhotos = [];
    for (var i = 0; i < photoCount; i++) 
    {
        var $element = $($photos[i]);
        var $src_big = $element.find("src_big");
        var $text = $src_big.text();
        resultantPhotos.push($text);
    }
    return resultantPhotos;
}

It fetches the XML response from a facebook query, parses it, and returns an array of photo urls from a facebook page. In Chrome, this works, but in Internet Explorer 6, the returned photo array is null. In both browsers the code executes without error.

I was using this JavaScript to parse the XML:

if (window.XMLHttpRequest) { 
    xmlHttp = new XMLHttpRequest();
}
else {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.open("GET", picsUrl, false); // Throws permission error in IE
xmlHttp.send(null);
var photos;
if (window.DOMParser) 
{
    var parser = new DOMParser();
    xml = parser.parseFromString(responseText, "text/xml");
} 
else  // Internet Explorer
{
    xml = new ActiveXObject("Microsoft.XMLDOM");
    xml.async = false;
    xml.loadXML(responseText);
}
photos = xml.getElementsByTagName("photo");

But that gave me errors in IE while still working in Chrome so I switched to jQuery. Do you know what's wrong with it?

If most of your clients use IE6 you seriously need new clients. — adeneo, Aug 19 '13 at 15:45
You are also trying to parse the XML response outside of the Ajax, you need to have that logic within the success function, since Ajax is async (of course) — Mark Pieszak - Trilon.io, Aug 19 '13 at 15:51
[@mcpDESIGNS](http://stackoverflow.com/users/1492009/mcpdesigns), I didn't realize that. I'll try reworking it and see what happens. — Jared Beach, Aug 19 '13 at 15:56
@mcpDESIGNS, nevermind. I just found this info: "the async option is deprecated since jQuery 1.8" and I'm using 1.10.x. I didn't realize that the A in AJAX stands for 'async.' I don't need to be using ajax then? — Jared Beach, Aug 19 '13 at 16:06
Just put the parsing logic etc inside of the success function using the `text` response you get back. — Mark Pieszak - Trilon.io, Aug 19 '13 at 16:07
@mcpDESIGNS How do I return the result async? I can't return from inside the success function can I? — Jared Beach, Aug 19 '13 at 16:11
@mcpDESIGNS They say I can use a callback function here: http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call — Jared Beach, Aug 19 '13 at 16:18
You just want to put it inside of `success: function (text) { /* put all your XML code here */ return resultantPhotos; }`. There are a lot of concepts going on at once here, you might need to look into deferred objects, `when($.ajax{})` type scenarios with this problem. — Mark Pieszak - Trilon.io, Aug 19 '13 at 17:16

score 0 · Answer 1 · answered Aug 20 '13 at 18:18

This may or may not be accurate, but I think the solution is to not use javascript at all, but to use PHP instead.

My errors were caused by javascript's lack of permission to access remote files. When I tried retrieving the XML output first with this PHP code:

<?php file_put_contents("query.xml", file_get_contents($facebookPicsUrl)); ?>

My javascript code

xml.open("GET","query.xml",false);

worked perfectly, but it made me realize that I should be using PHP, not only because downloading an xml file to my server is clunky, but because PHP can do everything that my JS is doing with simplexml_load_file. Everywhere I went looking for "how to get IE to open remote XML," they flat out say "you can't." Regardless of whether or not it's possible, it will be much easier to do this in PHP.

jQuery xmlParse not working in IE

1 Answers1