Articles → .NET → Bind XML And HTML

Bind XML And HTML






Software Requirement





Prerequisite Knowledge




  1. How to create projects in visual studio
  2. Basics of HTML.
  3. Basics of XML.
  4. How to set start up page in visual studio.
  5. How to run a project using visual studio.

Creation Of A New Project




Picture showing an empty .net project
Click to Enlarge


Adding HTML And XML File In The Project




Picture showing a HTML and xml file added in the project
Click to Enlarge


Adding Code In XML File




<?xml version="1.0" encoding="utf-8" ?>
<Employees>
	<Employee>
		<EmployeeName>Anurag</EmployeeName>
		<EmployeeAddress>Noida</EmployeeAddress>
	</Employee>
	<Employee>
		<EmployeeName>Karan</EmployeeName>
		<EmployeeAddress>Gurgaon</EmployeeAddress>
	</Employee>
</Employees>



Adding Code In HTML File




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<title></title>
</head>

<body>
	<xml id="Employees" src="Employees.xml" async="false" />
	<table datasrc="#Employees">
		<tr>
			<td> <strong>Name</strong>: </td>
			<td>
				<div datafld="EmployeeName" /> </td>
		</tr>
		<tr>
			<td> <strong>Mail</strong>: </td>
			<td>
				<div datafld="EmployeeAddress" /> </td>
		</tr>
	</table>
</body>

</html>




Picture showing the mapping of XML and HTML elements
Click to Enlarge


Output




Picture showing the output of binding XML with HTML
Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Thursday, July 26, 2012

Query/Feedback


Your Email Id
 
Subject
 
Query/FeedbackCharacters remaining 250