Click to return to the XML (Extensible Markup Language) home page    
XML Data Islands     XML Schema Developer's Gu...     XML Developer's Guide    
Web Workshop  |  XML (Extensible Markup Language)

Binding the XML Data Source Object to Data


The XML Data Source Object (DSO) allows you to bind HTML elements to an XML data set. By doing so, you can display a table of elements and attributes contained in the XML data. The contents of the table will then change as the XML data changes.

The XML DSO is only one of many provided DSOs. For more information on these other DSOs, see Adding a Data Source Object to a Page.

The following sections show how you can use the XML DSO for data binding:

Data Islands

In Microsoft® Internet Explorer 5, you can the use XML element to create what is called a "data island." Data islands are XML data referenced or included in an HTML page. The XML data can be included within the HTML or it can be in an external file.

Using the XML element allows you to avoid using script; if the user has disabled scripting for security reasons, the object tag version will not work because script is required to initialize the XML.

Inline XML

Inline XML is enclosed within the <XML> and </XML> tags, as show in the following example.

<XML ID="xmlData">
<?xml version="1.0" ?>
<trees>
	<tree>
		<name>Birch</name>
		<height unit="foot">10</height>
	</tree>
	<tree>
		<name>Aspen</name>
		<height unit="foot">4</height>
	</tree>
</trees>
</XML>

References to XML Files

External XML uses the SRC attribute on the <XML> tag to reference an external file. The SRC attribute can refer to a local file or specify a URL. By using URLs that point to external servers, data can be integrated from several sources. The following code shows using the SRC attribute with a local file.

<XML ID="xmlData" SRC="xmlData.xml"></XML>

The file "xmlData.xml" contains the XML. The SRC attribute can refer to a URL as well. For example:

<XML ID="xmlData" SRC="http://msdn.microsoft.com/workshop/author/composer.xml">
</XML>

Reading Data from Within a Data Island

The ID attribute given with the <XML> tag is used to reference the data island. By using HTML tags that can accept data source tags (binding the HTML to the data), you can format and display the data in the XML data island. The following example displays the XML items tagged with <meeting>.

<HTML><HEAD></HEAD><TITLE></TITLE>
<BODY>
<XML ID="xmlMeetings">
<?xml version="1.0" ?>
<meetings>
<meeting>
	<date>1/1/99</date>
	<time>9:00</time>
	<location>104</location>
</meeting>
<meeting>
	<date>2/1/99</date>
	<time>13:00</time>
	<location>34</location>
</meeting>
<meeting>
	<date>3/1/99</date>
	<time>14:30</time>
	<location>20</location>
</meeting>
</meetings>
</XML>

<table datasrc="#xmlMeetings">
<tr>
	<td><div datafld="date"></div></td>
	<td><div datafld="time"></div></td>
	<td><div datafld="location"></div></td>
</tr>
</table>

</BODY>
</HTML>

The <TABLE> tag uses the DATASRC attribute to reference the inline XML. The DATASRC refers to the ID attribute used to identify the XML preceded by a pound sign (#). Note that the TD element cannot be bound to data so a tag that binds to data must be used. In this case, it is the DIV element. The DIV element also allows the DATAFLD attribute to refer to the XML element to place in this cell of the table. In this case it's DATAFLD="date" for the <date> XML element.

As the XML is read, additional rows are created for each element tagged with the <meeting> tag.

Using the XML Data Source Object

You can either use the OBJECT element to refer to the XML DSO object, or you can use data islands and the XML element.

The XML Data Source ActiveX® object can be inserted into an HTML page as follows:

<OBJECT width=0 height=0
    classid="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39"
    id="xmldso">
</OBJECT>

This can be used as an XML data provider in conjunction with the data binding features of Internet Explorer 5 for binding XML data to HTML elements on the page.

To load XML into the DSO use the XMLDocument property to get a DOM object model, then call the load method as follows:

<SCRIPT for=window event=onload>
    var doc = xmldso.XMLDocument;
    doc.load("books.xml");
    if (doc.documentNode == null)
    {
        HandleError(doc);
    }
</SCRIPT>

Inline XML

You can also provide the XML inline inside the OBJECT element. The following example shows how to do this.

<OBJECT width=0 height=0
    classid="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39"
    id="xmldso">
<favorites>
	<favorite>
		<name>Microsoft</name>
		<url>http://www.microsoft.com</url>
	</favorite>
</favorites>
</OBJECT>

You use script to load the DSO as follows:

<SCRIPT for=window event=onload>
    var doc = xmldso.XMLDocument;
    doc.loadXML(xmldso.altHtml);
    if (doc.documentNode == null)
    {
        HandleError(doc);
    }
</SCRIPT>

Events Used with the XML Data Source Object

The XML Data Source Object triggers events when the underlying XML data changes. These events are common among the XML DSO and the other supplied DSOs. For more information on events and the data source object, see DHTML Event Model Support for Data Binding.

Viewing and Navigating a Subset of the Data

Sometimes you will want a table to display a small portion of your XML data set. To do so, you use the DATAPAGESIZE attribute on your TABLE element. The DATAPAGESIZE attribute indicates how many records to display in the table.

To navigate the table you can use the nextPage, previousPage, firstPage, and lastPage methods to display different pages of the data.

Usually, you can provide buttons to view different pages of the dataset with nextPage, previousPage, firstPage, and lastPage. For example, a button to view the next page could be written like this:

<INPUT TYPE="button" VALUE="Next" ONCLICK="tbl.nextPage();">

To specify the table, you could use the following code:

<TABLE DATAPAGESIZE=1 ID=tbl DATASRC=#xmlData>
...Table...
</TABLE>

This example sets the table to display one record (DATAPAGESIZE=1), identifies itself as "tbl" (ID=tbl), and uses a data source called "xmlData".

To indicate which table the button refers to, use the ID attribute used with the TABLE element.

The ONCLICK attribute can also specify "previousPage", "firstPage", or "lastPage". For example, to create a button to display the first page, use the following:

<INPUT TYPE="button" VALUE="First Page" ONCLICK="tbl.firstPage();">

The $Text Data Field

When you bind data using the XML DSO, an automatic field called "$Text" is created. It contains the items in that record, concatenated. The following example demonstrates the $Text data field.

<HTML><HEAD></HEAD><TITLE></TITLE>
<BODY>
<XML ID="xmlParts">
<?xml version="1.0" ?>
<parts>
<part>
	<partnumber>A1000</partnumber>
	<description>Flat washer</description>
	<quantity>1000</quantity>
</part>
<part>
	<partnumber>S2300</partnumber>
	<description>Machine screw</description>
	<quantity>1000</quantity>
</part>
<part>
	<partnumber>M2400</partnumber>
	<description>Nail</description>
	<quantity>500</quantity>
</part>
</parts>
</XML>

<table datasrc=#xmlParts>
<tr>
	<td><div datafld="partnumber"></div></td>
	<td><div datafld="$Text"></div></td>
</tr>
</table>

</BODY>
</HTML>

In this example, the table will consist of a column of part numbers (where datafld is equal to "partnumber") and a column containing the part number, description, and quantity concatenated (where datafld is equal to "$Text"). For example, the first row of the partnumber column will contain "S2300", while the second row of the $Text column will contain "S2300 Machine screw 1000". Note that the $Text column contains the part number.

Rules for Assigning XML Elements and Attributes to Columns and Rows

The XML DSO follows a procedure for assigning elements and attributes to columns and rows in databound applications. XML is modeled as a tree with one tag containing the entire hierarchy. For example, an XML description of a book could contain chapter tags, figure tags, and section tags. Containing all of these tags would be a book tag containing the subelements chapter, figure, and section. When the XML DSO assigns row and columns, the subelements, not the top level element, are converted.

The XML DSO uses this procedure for converting the subelements:

A simpler conversion takes place if you have set the JavaDSOCompatible flag to true. The JavaDSOCompatible flag makes the Internet Explorer 5 XML DSO compatible with the Java DSO supplied with Internet Explorer 4.0. To set the JavaDSOCompatible flag you can use the XML element as follows:

<xml id="xmldata" JavaDSOCompatible=true>
...XML data
</xml>

Or, you can use the following with the OBJECT element (using the XML element is recommended):

<OBJECT width=0 height=0
    classid="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39"
    id="xmldso">
	<PARAM NAME="JavaDSOCompatible" value="true">
</OBJECT>

The following method is used for creating rows and columns when JavaDSOCompatible is true:

For more information of the Java XML DSO, see XML Data Source.

Using DTDs

If you use a DTD (document type definition) with your XML, the XML DSO uses the following method for converting elements and attributes to rows and columns:

Additional Data Binding and XML Resources

For more information on data binding, see the following resources:

For tutorials and demos on using the XML DSO, see the following resources:



Back to topBack to top

Did you find this material useful? Gripes? Compliments? Suggestions for other articles? Write us!

© 1999 Microsoft Corporation. All rights reserved. Terms of use.