Working of Data Island

Data Island
Introduction
What is an XML data island? Simply stated it is data in the form of XML embedded in an HTML
document. By embedding XML data you create an XML data island, thereby storing your data
on the client. This is not good enough. You also want to know how to access it. The HTML
elements on the page can be bound to the XML data island and make them come to life, on
the client. In reality an XML data island represents a built-in Data Source Object in the IE
browser. This means you do not need <object/> tags to embed the control
Example describing an XML data island
First of all, to get a handle on XML data islands, let us start with a simple HTML file,
Simple.htm, with some embedded XML. Of course, you can create your own XML file, but for
this tutorial please follow the code shown in the next paragraph.
Simple.htm
<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<BODY>
<h3>Html file with embedded XML</h3>
<P>Here begins the XML Data Island</P>
<xml id="WebStudents">
<wclass>

<student id="1">
<name>Linda Jones</name>
<legacySkill>Access, VB5.0</legacySkill>
</student>
<student id="2">
<name>Adam Davidson</name>
<legacySkill>Cobol, MainFrame</legacySkill>
</student>
<student id="3">
<name>Charles Boyer</name>
<legacySkill>HTML, Photoshop</legacySkill>
</student>
<student id="4">
<name>Charles Mann</name>
<legacySkill>Cobol, MainFrame</legacySkill>
</student>
</wclass>
</xml> <P>Here ends the XML Data Island</P>
</BODY>
</HTML>
When you display this page in the browser, what you will see is only this. There is nothing to
indicate that something is embedded.
You can also embed the xml file which resides on the server.. See the example below.
Simple.htm
<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<BODY>
<h3>Html file with embedded XML</h3>
<P>Here begins the XML Data Island</P>
<xml id="WebStudents"
src=”http://localhost:8080/Demo/webstudents.xml”>
</xml> <P>Here ends the XML Data Island</P>
</BODY>
</HTML>
Now lets see how we can access the data island as embedded data source. Just add the
following code to your html file
<table DATASRC="#WebStudents">
<tr>
<td><span DATAFLD="name"></span></td>
</tr>
</table>
It will give you the name of all the students in one column. In the above code using DATASRC
we are specifying the source of data which is xml file which is embedded and DATAFLD is the
name of the field to which we want to bind the HTML control.
Now add the following code it will give you the complete data.
<table DATASRC="#WebStudents" border="1"

bgcolor="powderblue">
<tr>
<td><span DATAFLD="name"></td>
<td><span DATAFLD="id"></td>
<td><span DATAFLD="legacySkill"</td>
</tr>
HTML tags that can be bound to an XML island
An HTML table is but one of the elements for which you can bind data from an XML data
island. Here are a few examples that should work.
The Button object
<input type="button" DATASRC="#WebStudents" DataFld="name"/>

will show up when browsed as:
The Textbox object
<input type="text" DATASRC="#WebStudents" DataFld="name"/>

will show up as:
The Span tag
<span DATASRC="#WebStudents" DATAFld="legacySkill"></span>

will show up as:
The DIV tag
<div DATASRC="#webstudents" DataFld="name"/></div>
The marquee tag
<marquee DATASRC="#WebStudents" DataFld="name"> </marquee>

caught at a fixed location as:
Navigating through XML Data Island
The problem with the data island is, when you bind a HTML control to the data source it will
only display the first record.. To display other records you have to navigate through the whole
data source. Following is an example.
<html>
<head>
<script type="text/javascript">
function nextEmployee()
{
x=employee_xml.recordset
if (x.absoluteposition < x.recordcount)
{
x.movenext()
}else{
alert("This is the Last Record, can't go to next
more...");
}
}
function previousEmployee()
{
x=employee_xml.recordset
if (x.absoluteposition > 1)
{
x.moveprevious()
}else{
alert("This is the First Record, can't go to
previous more...");
}
}
</script>
</head>
<body>
<xml src="employee.xml" id="employee_xml"
async="false"></xml>
<center>
<table border="0" width="100%" id="table1">
<tr style="background-color:#0066CC;
color:#FFFFFF;FONT-WEIGHT: BOLD;">
<td colspan="2">Employees Records From
Employyes.xml</td>
</tr>
<tr style="background-color:#ccccCC; color:#111111;">
<td width="417">First Name :</td>
<td><span datasrc="#employee_xml"
datafld="FirstName"></span>
</td>
</tr>
<td width="417">Last Name :
</td>
datafld="LastName"></span></td>
</tr>
<td width="417">Gender :</td>
datafld="gender"></span></td>
</tr>
<tr>
<td width="417">
<p align="right"> <input type="button"
value="Previous Employee"
onclick="previousEmployee()" /></td>
<td> <input type="button" value="Next
Employee"
onclick="nextEmployee()" /></td>
</tr>
</table>
</center>
</body>
</html>
Employee_xml.recordset will create a recordset.
x.absoluteposition will give you the current position
x.recordcount will give you the total number of records in a recordset.
x.movenext will increment the absolute position to 1 and display the next record
x.moveprevious will decrement the absolute position to 1 and display the previous record.
There are other two methods x.movefirst() and x.movelast() to go to the first and last record
respectively.

Working of Data Island

Transféré par

Informations du document

Description originale:

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Working of Data Island

Transféré par

Droits d'auteur :

Formats disponibles

Data Island

Example describing an XML data island

<table DATASRC="#WebStudents" border="1"

The Button object

<input type="button" DATASRC="#WebStudents" DataFld="name"/>

The Textbox object

<input type="text" DATASRC="#WebStudents" DataFld="name"/>

The Span tag

<span DATASRC="#WebStudents" DATAFld="legacySkill"></span>

The DIV tag

<div DATASRC="#webstudents" DataFld="name"/></div>

The marquee tag

<marquee DATASRC="#WebStudents" DataFld="name"> </marquee>

Employee_xml.recordset will create a recordset.

x.absoluteposition will give you the current position

x.recordcount will give you the total number of records in a recordset.

Vous aimerez peut-être aussi