How to display XML elements in an HTML table using Data Islands?

To bind an XML data to an HTML table, add the datasrc (data source) attribute to the table element, then add the datafld (data field) attributes to any other inline eg. <div>, <span> or <input> tags between the <td> elements. (The <td> element cannot include the datasrc attribute.)

<xml id="books">
<?xml version="1.0"?>
<books>
   <book>
	<title>OpenGL Programming Guide Fourth Edition</title>
	<location>107</location>
	<publisher>Addison-Wesley</publisher>
	<year>2004</year>
   </book>
   <book>
	<title>Curves and Surfaces for CAGD: A Practical Guide</title>
	<location>116</location>
	<publisher>Academic Press</publisher>
	<year>2002</year>
   </book>
   <book>
	<title>An Introduction to NURBS: With Historical Perspective</title>
	<location>120</location>
	<publisher>Academic Press</publisher>
	<year>2001</year>
   </book>
   <book>
	<title>NURBS: From Projective Geometry to Practical Use</title>
	<location>126</location>
	<publisher>A K Peters</publisher>
	<year>1999</year>
   </book>
</books>
</xml>

The datasrc attribute references the id attribute of an <xml> tag and binds a XML data to a HTML table.

<table width="100%" cellpadding="0" cellspacing="2" border="0" datasrc="#books"> 
 <thead>
   <tr>
	<th>Title</th>
	<th>Location</th>
	<th>Publisher</th>
	<th>Year</th>
   </tr>
 </thead>
 <tbody>
   <tr>
    	<td><span datafld="title"></span></td>
	<td><span datafld="location"></span></td>
    	<td><span datafld="publisher"></span></td>
	<td><span datafld="year"></span></td>
   </tr>
 </tbody>
</table>

Back to XML FAQ