topical media & game development
professional-ria-03-XMLQueryExample.htm / htm
<!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" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Example XML Query and Response Parse</title>
<link rel=StyleSheet href="../../stylesheets/RIAStyle1.css" TYPE="text/css">
<script src="../../scripts/xmlw3cdom.js" type="text/javascript"> </script>
<script src="../../scripts/xmlsax.js" type="text/javascript"> </script>
<script type="text/javascript">
//<![CDATA[
var xmlhttp = false;
function queryHandler(target) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
} catch (e) {
}
if(target !== ""){
var url = '../../phpscripts/xmlQuery.php?' + target;
xmlhttp.open('GET', url, true);
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById('Result').innerHTML = '';
var cleanXMLText = cleanupResponseString(xmlhttp.responseText);
parseResult(cleanXMLText);
} else {
document.getElementById('State').innerHTML = "Loading...";
}
};
xmlhttp.send(null);
}
}
function cleanupResponseString(response){
return response.slice(response.indexOf("<"), response.lastIndexOf(">")+1);
}
//maybe a picture would be good here ...
function parseResult(xml) {
//instantiate the W3C DOM Parser
var parser = new DOMImplementation();
//load the XML into the parser and get the DOMDocument
var domDoc = parser.loadXML(xml);
//get the root node (in this case, it is ResultSet)
var docRoot = domDoc.getDocumentElement();
//display the data
document.getElementById("Title").innerHTML = docRoot.getElementsByTagName("Title").item(0).getFirstChild().getNodeValue();
if (docRoot.getElementsByTagName("Summary").item(0).getFirstChild() != null){
document.getElementById("Summary").innerHTML =
docRoot.getElementsByTagName("Summary").item(0).getFirstChild().getNodeValue();
} else {
document.getElementById("Summary").innerHTML = "No Summary";
}
// heree we are getting an attribute of ResultSet, not a node; thus a somewhat different strategy ...
var totalHits = docRoot.getAttributeNode("totalResultsAvailable").getNodeValue()
document.getElementById("TotalHits").innerHTML = totalHits;
document.getElementById("PictureHeader").innerHTML = "<p>an Example Picture</p>";
document.getElementById("PictureURL").innerHTML =
"<img src=\""+
docRoot.getElementsByTagName("ClickUrl").item(0).getFirstChild().getNodeValue() +
"\" alt=\""+
docRoot.getElementsByTagName("ClickUrl").item(0).getFirstChild().getNodeValue() +
"\"/>"
;
document.getElementById("State").innerHTML = "";
} // end function parseResult
function onLoad() {
//TODO Lock HTTP requests against each other...
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
xmlhttp.overrideMimeType('text/xml');
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
function doQuery() {
var query = document.getElementById("imageQuery").value;
var uri = "http://api.search.yahoo.com/ImageSearchService/V1/imageSearch?appid=YahooDemo&query="+query+"&results=1&output=xml";
queryHandler(uri);
}
//]]>
</script>
</head>
<body onload="onLoad()">
<div id="header">
<h1>Simple XML DOM Query and Parsing Sample </h1>
<h2>
Use a JavaScript call to directly invoke RESTFul Service.
Get the response back as a XML Object. Parse the XML to get Tags, tag attributes
and the value of the nodes delimited by tags..
</h2>
</div>
<br />
<div class="inputelement"><button onClick="doQuery()">Image Search Term</button>
<input id="imageQuery" value="Rose" size="50"></input>
</div>
<br />
<div id="State"></div>
<div id="Result"></div>
<p>TotalHits: <span id="TotalHits" style="font-weight:bold"></span> </p>
<p>Title: <span id="Title" style="font-weight:bold"></span> </p>
<p>Summary: <span id="Summary" style="font-weight:bold"></span> </p>
<span id="PictureHeader" class="pictureHeader"></span>
<span id="PictureURL"></span>
</body>
</html>
(C) Æliens
20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.