We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Treegrid using hierarchical XML data


I'm trying to understand the examples of the ASP.NET Webforms.  So far so good, but I have something I can't find.

In the example of using XML data as source for the TreeGrid , the file TreeGridXML is used.  It sets some sample hierarchy by using the ParentId attribute.

However I can also see another attribute of the TreeGrid component which is ChildMapping,  ie.  ChildMapping="Children" . I think this is what I'm looking for because I want to structure the XML  in a nested layout with several levels with the ParentId attribute, it can be hard, as there are no levels anymore only a list of  n elements

Question:  how is the ChildMapping used?   I tried to add a sub attribute, for instance <Children> and then add the elements inside i.e. <Task>...</Task>  but it doesn't seem to work.

Any idea,  example?

Thanks a lot.

1 Reply

JS Jonesherine Stephen Syncfusion Team February 10, 2017 06:26 PM UTC

Hi Ramon, 
Thanks for contacting Syncfusion support. 
We can load hierarchical XML data in TreeGrid by using XMLSerializer class. 
Please find the steps to render a TreeGrid with hierarchical XML data. 
1. Copy XML file content in clipboard.  
2. Created a class file using Paste Special option in visual studio, please find the screen shot below.  
3. In this support XML file’s equivalent class file is created.    
4.  Then we can retrieve the data from XML file by using XML Serializer with type of created class, please find the code snippet below. 
protected void Page_Load(object sender, EventArgs e) 
            XmlSerializer serializer = new XmlSerializer(typeof(GanttXML)); 
            GanttXML obj = new GanttXML(); 
            using (FileStream stream = File.OpenRead(Server.MapPath("~/App_Data/GanttXML.xml"))) 
                obj = (GanttXML)serializer.Deserialize(stream); 
            this.TreeGrid1.DataSource = obj.Task; 
5. In client side we can map the child items by using “childMapping” property, please find the code snippet below. 
<ej:TreeGrid runat="server" ID="TreeGrid1" ChildMapping="Children"> 
We have prepared sample for this, please find the sample from below location 
Jone sherine P S 

Live Chat Icon For mobile
Up arrow icon