XML- Ajex Example
XML
//Test.php
<script src="jquery-1.11.0.min.js" type="text/javascript">
</script>
<script src="test.js" type="text/javascript"></script>
<body>
<h1>The child node of rot node are</h1>
<div id="dvContent">
</div>
</body>
|
//test.js
$(document).ready(function(){
$("#dvContent").append("<ul></ul>");
$.ajax({
type: "GET",
url: "BookList.xml",
dataType: "xml",
success: function(xml){
$(xml).find('Book').each(function(){
var sTitle = $(this).find('Title').text();
var sPublisher = $(this).find('Publisher').text();
var sAuthor = $(this).find('Firstname').text();
$("<li></li>").html(sTitle + ", " + sPublisher+","+sAuthor).appendTo("#dvContent ul");
});
},
error: function() {
alert("An error occurred while processing XML file.");
}
});
});
|
//BookList.xml
<?xml version="1.0" encoding="utf-8" ?>
<BookList>
<Book>
<Title>jQuery: Novice to Ninja</Title>
<Publisher>Site point</Publisher>
<Author><Firstname>aashish</Firstname>
<Lastname>mittal</Lastname>
</Author>
</Book>
<Book>
<Title>Learning jQuery</Title>
<Publisher>PACKT</Publisher>
<Author><Firstname>aashish</Firstname>
<Lastname>mittal</Lastname>
</Author>
</Book>
<Book>
<Title>Head First jQuery</Title>
<Publisher>O'Reilly</Publisher>
<Author><Firstname>aashish</Firstname>
<Lastname>mittal</Lastname>
</Author>
</Book>
<Book>
<Title>jQuery UI 1.8</Title>
<Publisher>PACKT</Publisher>
<Author><Firstname>aashish</Firstname>
<Lastname>mittal</Lastname>
</Author>
</Book>
</BookList>
|
