LogoASPAlliance: Articles, reviews, and samples for .NET Developers
Edit XML Files Using ASP.NET TreeView Control
by Nishanth Nair
Average Rating: 
Views (Total / Last 10 Days): 42033/ 67


This article explains how to use the ASP.NET TreeView control to edit an XML file which resides on the same server. The origin of this article starts when there was a demand from the end users to create an Admin section to edit a configuration XML file for an internal ASP.NET application. The functionalities of the application were completely configurable and the configuration values were kept in this particular XML file. To edit this XML file, the admins had to login in to the server which hosted the application and edit the XML file using a text editor which was tedious.

After some research I developed a control panel for the application which uses TreeView Control and a TextBox control to edit the configuration XML File.

Application Functionality

Listing 1 – XML Editor View

Steps for editing XML File

Even though the functionality of the page is evident from the screenshot, the process of editing the XML file is described below.

The path of the XML file is provided in the XML File Path TextBox. (In the source code, the path ~/App_Data/Book.xml is hardcoded. This file is available in the same directory with the source code.)

Clicking the Load File button will load the TreeView Control with the XML file via an XmlDataSource object.

When the user clicks on a particular node of the TreeView Control, the InnerXML of the node is loaded in the TextBox on the right side.

Now the user can edit the XML as required.

Clicking on the Save Button will save the XML file.

Explanation of Source Code

Most of the source code is self explanatory, however let's dive into some details:


Listing 2 – TreeView Control

<asp:TreeView ID="xmlTreeView" runat="server"   
     <asp:TreeNodeBinding DataMember="Book" ValueField="Id" ImageUrl="~/Images/add.png" />
    <LeafNodeStyle ImageUrl="~/Images/leaf.png" />
    <RootNodeStyle ImageUrl="~/Images/add.png" />
    <ParentNodeStyle ImageUrl="~/Images/action_forward.gif" />

AutoGenerateDataBindings property of the TreeView is enabled. This tells the control to generate the tree node bindings automatically from the DataSource.

DataBindings Section defines how the fields of hierarchical data items are mapped to TreeNode properties. Here I have bound the Node "Book" using TreeNodeBinding. The ValueField is given as the "Id" attribute of the Book Node. This is very important as this ValueField is used to generate the DataPath of the SelectedNode and helps to uniquely identify each node.

You can also change the appearance of the Tree Node by providing Images to the ImageUrl property.

Other properties like LeafNodeStyle, RootNodeStyle, ParentNodeStyle etc are pretty self explanatory.

Code Behind(C#)

   protected void xmlTreeView_SelectedNodeChanged(object sender, EventArgs e)
        XmlDocument doc = new XmlDocument();
        XmlNode node = doc.SelectSingleNode(xmlTreeView.SelectedNode.DataPath);        
        txtEditXML.Text = node.InnerXml;
        Session["CurrentEditXpath"= xmlTreeView.SelectedNode.DataPath;

In the SelectedNodeChanged event, we load an XmlDocument using the same XML file and identify the node using the SelectedNode.DataPath property of the TreeView Control. The InnerXml is loaded to the Text box for editing. The DataPath is preserved in the Session state to use when the node is saved.


A restriction of this approach is that in the XML file, each node must be uniquely identifiable. Otherwise the Xpath approach won't work.

Source Code

[Download Source Code]

The source code is written using .NET 3.5 and Visual Studio 2008. There are no other dependencies. It can be easily downgraded to .NET 2.0.


This piece of code can be used for editing XML files which are used for configuration or storing data within an ASP.NET application without physically logging in to the server machine in which the application is hosted. The Default.aspx page in the source code can be easily added to an existing application to be used as an Edit Section for XML files, provided correct TreeNodeBinding is provided as per your XML file.

Happy Coding!!

Product Spotlight
Product Spotlight 

©Copyright 1998-2021  |  Page Processed at 2021-12-04 6:12:40 AM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search