Processing XML with jQuery cross-browser

Question

I am new to jQuery and am having cross-browser inconsistencies. I am trying to populate an HTML drop down using jQuery to parse the XML document. Eventually, I will swap the XML document with an HTTP call, but for now, I am doing a GET of the local XML copy. My approach works in Firefox (2 elements show up in the drop down) but IE7 isn't processing the XML as desired. IE7 doesn't seem to be parsing the XML at all.
Here is my snippet:

<script src="jquery-1.3.2.js"></script>

<title>test</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script>

    $(document).ready(function() {
        $.ajax({
            type: "GET",
            url: "data.xml",
            dataType: ($.browser.msie) ? "text/xml" : "xml",
            success: function(xml) {
                var select = $('#aoi');
                $(xml).find('area').each(function() {
                    var name = $(this).find('name').text();
                    var type = $(this).find('type').text(); 
  //alert(name + " : " + type);
                    select.append("<option>" + name + " : " + type + "</option>");
                });
                select.children(":first").text("please make a selection").attr("selected", true);
            }
        });
    });

</script>

    <tr>
        <td>Shape</td>
        <td>
      <select id="aoi">
       <option>loading</option>
      </select>
        </td>
    </tr>
</table>

</form>

And the XML file (data.xml) is:

<?xml version="1.0" encoding="ISO-8859-1"?>
<areasofinterest>
<area id="1">
<id>1</id>
<name>square</name>
<type>UserDefined</type>
</area>
<area id="2">
<id>2</id>
<name>small square</name>
<type>UserDefined</type>
</area>
</areasofinterest>


Thank you for your help!

Answer 1

Have you tried replacing dataType: ($.browser.msie) ? "text/xml" : "xml", with dataType: "xml"?

The dataType is a hint for jQuery... I can't see anything in the code-base where text/xml is used... it should be xml regardless of browser!

Answer 2

hi i have used the following function for IE to load the xml.

function load_xml(msg)
{   //this function will load xml even used in IE or any other browser
    if ( typeof msg == 'string') {
                   data = new ActiveXObject( 'Microsoft.XMLDOM');
        data.async = false;
        data.loadXML( msg);
     } else {
       data = msg;
     }
     return data;
}




$(document).ready(function() {
        $.ajax({
            type: "GET",
            url: "data.xml",
            dataType: ($.browser.msie) ? "text/xml" : "xml",
            success: function(xml) {
                 *//call the function here and pass the xml document to it*
               var xml2=load_xml(xml);
                var select = $('#aoi');
                $(xml2).find('area').each(function() {
                    var name = $(this).find('name').text();
                    var type = $(this).find('type').text(); 
                //alert(name + " : " + type);
                    select.append("<option>" + name + " : " + type + "</option>");
                });
                select.children(":first").text("please make a selection").attr("selected", true);
            }
        });
    });