How to bind HTML table with an XML document

In the following example i will show you how you can display data in a HTML table from an XML document.
 
In the example below see the XML data for counties and their capitals

<?xml version='1.0'?>
<Capitals>
  <Country>
   <Name>
     India
   </Name>
   <Capital>
     NewDelhi
   </Capital>
  </Country>
  <Country>
   <Name>
     USA
   </Name>
   <Capital>
     Washington
   </Capital>
  </Country>
</Capitals>

 
And now see the following HTML document. In the example below i am binding an XML data using a datasource attribute inside a span element.
 

<html>
    <body>
       <xml id="Capitals" src="Capitals.xml"/> 
        <table datasrc="#Capitals">
           <tr>
                <td> <span datafld="Name"></span></td>
                <td> <span datafld="Capital"></span></td>
           </tr>
       </table>  
    </body>
</html>

 
The output will be like this:

India New Delhi
France Paris>

Author: Hirendra Sisodiya

Programmer at PSPL. Can be found on Google Plus.