Article
Using the XML Data Source Object
Now, we'll take a look at how to extract contents from an external XML file using XML-DSO. Consider the following XML file:
<!-- example3.xml -->
<?xml version="1.0" ?>
<ticker>
<item>
<message>JavaScript Ticker using XML DSO</message>
<URL>http://someURL.com</URL>
</item>
</ticker>
Now, consider the following HTML page:
<!-- example3.htm -->
<html>
<head>
<title>XML DSO-example3.htm</title>
<script language="JavaScript">
function load() {
var xmlDso=myXML.XMLDocument;
xmlDso.load("example3.xml");
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="load()">
<object id="myXML" CLASSID="clsid:550dda30-0541-11d2-9ca9-
0060b0ec3d39" width="0" height="0">
</object>
<table datasrc="#myXML" border="1">
<thead>
<th>Message</th>
<th>URL</th>
</thead>
<tr>
<td><div datafld="message"></div></td>
<td><div datafld="URL"></div></td>
</tr>
</table>
</body>
</html>
The output of the above is:
Observe the code of example3.htm. First, we’ve created a XML-DSO object with id as myXML. Note that we have added the width and height attributes to the <OBJECT> tag and set their values to 0. This is because we want to create an XML-DSO object, but we don’t want it to occupy any space in the Web page
Next, we have created a table with datasrc as myXML, similar to example 2. We have extracted the content using <DIV> tags (within TD tags) with datafld as message for the first column and URL for the second column. The additional code here is the <SCRIPT> we’ve added. As you can see in the script, we’ve set the variable xmlDso to myXML.XMLDocument, which refers to the object we have created. Next, we load example3.xml using the XML-DSO's load()method. Now the file example3.xml is bound to the object, myXML. Everything else is similar to the previous examples.
Thus, when we want to load an external XML file using XML-DSO, we have to explicitly include the object, as well as a small bit of JavaScript to load the external XML file. The above script is very specific and cannot be used to load just any XML file. A more generic script is as follows:
<script language="JavaScript">
var xmlDso;
function load(xmlFile, objName) {
eval('xmlDso='+objName+'.XMLDocument');
xmlDso.load(xmlFile);
}
</script>
And, to load any XML file, use:
load("SomeXMLFile.xml","anyXmlDsoObject");
XML DSO and JavaScript
It’s also possible to manipulate the XML DSO object using JavaScript. Consider the following XML file:
<!-- example4.xml -->
<?xml version="1.0" ?>
<myDB>
<member>
<name>Premshree Pillai</name>
<sex>male</sex>
</member>
<member>
<name>Vinod</name>
<sex>male</sex>
</member>
<member>
<name>Santhosh</name>
<sex>male</sex>
</member>
</myDB>
Now, consider the following HTML file:
<!-- example4.htm -->
<html>
<head>
<title>XML DSO-example4.htm</title>
<script language="JavaScript">
function load() {
var xmlDso=myDB.XMLDocument;
xmlDso.load("example4.xml");
/* Get the complete record set */
var memberSet=myDB.recordset;
/* Go to next data */
memberSet.moveNext();
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="load()">
<object id="myDB" CLASSID="clsid:550dda30-0541-11d2-9ca9-
0060b0ec3d39" width="0" height="0">
</object>
<span datasrc="#myDB" datafld="name"></span>
</body>
</html>
Now, the output of the above will be:
Vinod
The above script is fairly self explanatory. Initially, we store the entire data of the data file into a variable memberSet using the recordset method. The moveNext() method points to the next data item (next row). Some of other methods that can be used here are:
movePrevious(): Point to the previous data item.moveFirst(): Point to the first data item.moveLast(): Point to the last data item.EOF: This property is used to check whether we’ve reached the end of the data.
Note that, in the above methods, the data is pointed relative to parent of the nodes being displayed.