XML in ACTION : AJAX Sample Program

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en"> <head>
<meta http-equiv="content-type" content="text/html;
charset=utf-8" />
<title>Ajax learners</title>
<script type="text/javascript" src="fetchxml.js"></script>
</head>
<body>
<h1>Ajax Technologies</h1>
<ul>
<li>
<a href="w3c.xml"
onclick="grabFile(this.href); return false;">W3C</a>
</li>
<li>
<a href="XML.xml"
onclick="grabFile(this.href); return false;">XML</a>
</li>
<li>
<a href="CSS.xml"
onclick="grabFile(this.href); return false;">CSS</a>
</li>
<li>
<a href="XMLHttpRequest.xml"
onclick="grabFile(this.href); return false;">XMLHttpRequest</a>
</li>
<li>
<a href="JavaScript.xml"
onclick="grabFile(this.href); return false;">JavaScript</a>
</li>
</ul>
<div id="details"></div>
</body>
</html>


// JavaScript Document fetchxml.js
function getHTTPObject() {
var xhr = false;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
xhr = false;
}
}
}
return xhr;
}

function grabFile(file) {
var request = getHTTPObject();
if (request) {
request.onreadystatechange = function() {
parseResponse(request);
};
request.open("GET", file, true);
request.send(null);
}
}

function parseResponse(request) {
if (request.readyState == 4) {
if (request.status == 200 || request.status == 304) {
var data = request.responseXML;
var name = data.getElementsByTagName("name")[0].
firstChild.nodeValue;
var website = data.getElementsByTagName("website")[0].
firstChild.nodeValue;
var email = data.getElementsByTagName("email")[0].
firstChild.nodeValue;
var header = document.createElement("h2");
var mailto = document.createElement("a");
mailto.setAttribute("href","mailto:"+email);
var text = document.createTextNode(name);
mailto.appendChild(text);
header.appendChild(mailto);
var link = document.createElement("a");
link.setAttribute("href",website);
var linktext = document.createTextNode(website);
link.appendChild(linktext);
var details = document.getElementById("details");

while (details.hasChildNodes()) {
details.removeChild(details.lastChild);
}

details.appendChild(header);
details.appendChild(link);
}
}
}

XML introduction in AJAX

XML stands for eXtensible Markup Language.XML is nothing more than a text file containing a single well-formed XML document.

It is a general-purpose markup language that can be used to describe just about anything. XML differs from other markup languages like SGML and HTML. It’s a kind of metalanguage. The structure of an XML document must follow certain rules, but the vocabulary used within that structure isn’t tied to any dictionary of terms.

A tree data structure is built of nodes, with each node having only one node connected above it, called a parent node. The sole exception to this rule is the root node, which has no parent node. Nodes can also have other nodes connected below; these are called child nodes. In addition, nodes that are on the same level as the same parent node are called children. The following image is a graphical representation of a tree data structure.


An XML Document as Text

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<organization>

<employee><empid/><empname/></employee>

<employee> <empid/> <empname/> </employee>

<employee><empid/><empname/> </employee>

</organization>

Useful Links on Adobe Flex

Your Ad Here

Latest Books on Adobe Flex