Category / Section
How to bind XML data to TreeGrid
1 min read
It is possible to bind XML data to TreeGrid by using ParentIdMapping and IdMapping properties, where the xml tags must be mapped as fields in TreeGrid columns. Please refer the below code snippets for importing XML data into TreeGrid.
Code snippets:
In Default.aspx:
<body> <form id="Form1" runat="server" onsubmit="return false"> <ej:TreeGrid runat="server" ID="TreeGridControlEditing" IdMapping="Id" ParentIdMapping="ParentId"> <columns> <ej:TreeGridColumn HeaderText="Task Id" Field="Id" Width="55" EditType="Numeric"/> <ej:TreeGridColumn HeaderText="Task Name" Field="Name" EditType="String"/> <ej:TreeGridColumn HeaderText="Start Date" Field="StartDate" EditType="Datepicker"/> <ej:TreeGridColumn HeaderText="End Date" Field="EndDate" EditType="Datepicker"/> <ej:TreeGridColumn HeaderText="Duration" Field="Duration" EditType="Numeric" /> <ej:TreeGridColumn HeaderText="Progress" Field="PercentDone" EditType="Numeric"/> </columns> //... </ej:TreeGrid> </form> </body>
In XML file:
<?xml version="1.0" encoding="utf-8" ?> <TreeGridXML> <Task> <Id>1</Id> <Name>Planning Schedule</Name> <StartDate>02/04/2014</StartDate> <EndDate>02/06/2014</EndDate> <PercentDone>40</PercentDone> <Duration>4</Duration> </Task> <Task> <Id>2</Id> <Name>Plan Timeline</Name> <StartDate>02/04/2014</StartDate> <EndDate>02/06/2014</EndDate> <PercentDone>60</PercentDone> <Duration>4</Duration> <ParentId>1</ParentId> </Task> //... </TreeGridXML>
In Default.aspx.cs:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; namespace TreeGrid { public partial class _Default : Page { protected void Page_Load(object sender, EventArgs e) { DataSet data = new DataSet(); data.ReadXml(Server.MapPath("~/App_Data/treeGridData.xml")); this.TreeGridControlEditing.DataSource = data; this.TreeGridControlEditing.DataBind(); } } }
Please find the demo sample link below for XML databinding in TreeGrid