what's the best way to parse xml response in AJAX

Solution 1:

A regular $.ajax with dataType: "xml" will do the trick, then you can browse the contents with jQuery selectors like you would a simple web page (e.g. the attr function in the example to retrieve the "code" field of each book node or the find function to find specific node types).

For example, you could do this to find a specific book by title:

$(xml).find("book[title='Cinderella']")

where xml is the data the success handler receives from $.ajax.

Here is the complete example:

<!DOCTYPE html>
<html>
<head>
 <title>jQuery and XML</title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta name="language" content="en" />
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body

<div id="output"></div>

<script type="text/javascript">
$(document).ready(function(){
 $.ajax({
  type: "GET",
  dataType: "xml",
  url: "example.xml",
  success: function(xml){
   $(xml).find("book").each(function(){
    $("#output").append($(this).attr("code") + "<br />");
   });
  }
 });
});
</script>


</body>
</html>

And a matching XML file:

<?xml version="1.0" encoding="UTF-8"?> 
<books title="A list of books">
 <book code="abcdef" />
 <book code="ghijklm">
  Some text contents
 </book>
</books>

Solution 2:

Return the data with the right content type (e.g. application/xml) and XHR will parse it for you.

See also: the dataType argument for jQuery's ajax method.

what's the best way to parse xml response in AJAX

Solution 1:

Solution 2:

Related

Recent Posts