CODEWITHSUNDEEP
jqueryinternet-explorercross-browserxml-parsing
John
John

Reputation: 2501

jQuery find() does work on Chrome and Firefox but not IE

this is the response I get from a web service for a submitted Url.

HTTP/1.1 200 OK
Server: Apache-Coyote/1.1
Content-Type: text/xml;charset=UTF-8
Content-Language: en-US
Transfer-Encoding: chunked
Date: Sun, 20 May 2012 15:35:52 GMT
Connection: close

841
<!--?xml version="1.0" encoding="UTF-8"?-->
<doi_records>
  <doi_record owner="10.1016" timestamp="2012-04-21 12:08:25">
    <crossref>
      <journal>
        <journal_metadata language="en">
          <full_title>Procedia - Social and Behavioral Sciences</full_title>
          <abbrev_title>Procedia - Social and Behavioral Sciences</abbrev_title>
          <issn media_type="print">18770428</issn>
        </journal_metadata>
        <journal_issue>
          <publication_date media_type="print">
            <month>1</month>
            <year>2011</year>
          </publication_date>
          <journal_volume>
            <volume>15</volume>
          </journal_volume>
          <special_numbering>C</special_numbering>
        </journal_issue>
        <journal_article publication_type="full_text">
          <titles>
            <title>The effect of teaching the cognitive and meta-cognitive strategies (self-instruction procedure) on verbal math problem-solving performance of primary school students with verbal problem- solving difficulties</title>
          </titles>
          <contributors>
            <person_name contributor_role="author" sequence="first">
              <given_name>Narges</given_name>
              <surname>Babakhani</surname>
            </person_name>
          </contributors>
          <publication_date media_type="print">
            <month>1</month>
            <year>2011</year>
          </publication_date>
          <pages>
            <first_page>563</first_page>
            <last_page>570</last_page>
          </pages>
          <publisher_item>
            <item_number item_number_type="sequence-number">S1877042811003211</item_number>
            <identifier id_type="pii">S1877042811003211</identifier>
          </publisher_item>
          <doi_data>
            <doi>10.1016/j.sbspro.2011.03.142</doi>
            <resource>http://linkinghub.elsevier.com/retrieve/pii/S1877042811003211</resource>
          </doi_data>
        </journal_article>
      </journal>
    </crossref>
  </doi_record>
</doi_records>
0

user inputs a inputs a variable is a form and clicks on a <button>, ajax call triggers and gets above data. then depending on the returned xml appropriate action should be done. this is what I am doing:

<script type="text/javascript">
...
if ($('input:text[name=ident]').val() !=  "")
{
    $.post("<?php echo site_url('con/met/') ?>",
    {doi:$('input:text[name=ident]').val()}, 
    function(responseText){ parseXmlDoi(responseText)},  
    "html"
);
...
}
</script>

and here is my parseXmlDoi function:

function parseXmlDoi(xml)
{

    $('#debug').fadeIn();
    $('#debug').html('');

    if ($(xml).find('error').text())
    {
        $('#debug').html('<div dir="rtl" class=\"message warning\"><p>error</p></div>');
    }
    else if ($(xml).find('book').text())
    {
        $('#debug').html('<div dir="rtl" class=\"message info\"><p>this is a book</p></div>');
    }
    else if ($(xml).find('journal').text())
    {

        // do some stuff

    }
    else
    {
         $('#debug').html('<div dir="rtl" class=\"message error\"><p> something is wrong</p></div>');

    }
}

the problem: in Chrome and Firefox based on given above Xml, it works and it executes // do some stuff but at IE it says something is wrong it means that the find() is not working.

Upvotes: 1

Views: 950

Answers (2)

John
John

Reputation: 2501

ok I got the answer:

I managed to get the exact xml from the url in the Ajax POSTso the response turned to be the same except the header information.

and edited my Ajax call to this:

$.ajax({
 url:"<?php echo site_url('con/met/') ?>",
 type:"POST",
 data:{doi : $('input:text[name=ident]').val()},
 dataType: "html", //this should be html because the php page uses echo to give data back
 success: function(data)
 {
     var xml;
     if (jQuery.browser.msie) { //for IE
       xml = new ActiveXObject("Microsoft.XMLDOM");
       xml.async = false;
       xml.loadXML(data);
     } else { //for non IE
       xml = data;
     }
     parseXmlDoi(xml);
   }   
});

Upvotes: 0

T.J. Crowder
T.J. Crowder

Reputation: 1074969

You're explicitly telling jQuery to treat the response as HTML rather than XML, so what you get back is a string. Then you call $() on that string, which tells it to parse it as HTML, not as XML.

I can't see any reason for overriding the default processing, but I suspect it may be the issue, as IE doesn't much like HTML tags it doesn't know.

Try this instead:

$.post(
    "<?php echo site_url('con/met/') ?>",
    {doi:$('input:text[name=ident]').val()},
    parseXmlDoi,
    "xml" // Or leave this off, your content type should trigger XML handling
);

...and change the beginning of parseXmlDoi to:

function parseXmlDoi(xmlDoc)
{
    var $xml = $(xmlDoc);

    // ...now, use $xml.find...//
}

By telling jQuery to treat the response as XML, you'll get a parsed XML document passed into your success function. Then we use $() to wrap that XML document in a jQuery instance so you can use find on it.

Upvotes: 1

Related Questions