Home > Developer > ASP

Asp. NET implementation of the TreeView XML data Source Binding instance Code _ Practical Skills

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

The TreeView control can use an XML document as a data source to display nodes based on the hierarchy of the XML document. The access to the XML document is done by the XmlDataSource control, specifying the XML document path from the DataFile property of the XmlDataSource control, and then setting the corresponding relationship to the nodes in the XML document in the TreeView control. This example shows how to bind the TreeView control to an XML data source.

Technical points
The technical essentials for binding the TreeView control to an XML data source are as follows.

Use the XmlDataSource control to provide access to XML documents.

Specifies the corresponding relationship between the node and the XML document in the DataBindings property of the TreeView control.


Implementation steps

(1) Create a asp.net web site in VS2008, named "TreeViewSample2".

(2) Add a page named "Treeviewcontrol.aspx" and set the page as the starting page.

(3) Create an XML document in the "App_Data" folder, named "XMLFile.xml", which contains a three-layer structure: contact, region, and owner. The code looks like this.

Copy Code code as follows:

<?xml version= "1.0" encoding= "Utf-8"?>
<contact name= "Contacts" >
<genre name= "South China" >
<person text= "person in charge" >
<name>
John </name>
<sex>
Male </sex>
<age>
25</age>
<address>
Guangzhou Huangpu </address>
</person>
<person text= "person in charge" >
<name>
Dick </name>
<sex>
Male </sex>
<age>
28</age>
<address>
Foshan Nanhai District </address>
</person>
</genre>
<genre name= "North China" >
<person text= "person in charge" >
<name>
Harry </name>
<sex>
Male </sex>
<age>
30</age>
<address>
Haidian District, Beijing </address>
</person>
</genre>
</contact>

(4) Select the TreeView control and the XmlDataSource Control design page from the Toolbox and set the XmlDataSource control DataFile property to "~/app_data/xmlfile.xml". and set the DataSourceID property of the TreeView control to "XmlDataSource1".

(5) When the page is first loaded, programmatically add a node to the XML document binding through the TreeNodeBinding object (or you can specify it using the designer). The code looks like this.

Copy Code code as follows:

<%@ Page language= "C #" autoeventwireup= "true"%>
<script runat= "Server" >
protected void Page_Load (object sender, EventArgs e)
{
if (! IsPostBack)
{
This. Treeview1.showlines = true;
The following are the corresponding relationships between adding nodes and data source bindings
TreeNodeBinding contact = new TreeNodeBinding ();
Contact. DataMember = "Contact";//Specify the member of the binding
Contact. Valuefield = "name";//Value field
This. TREEVIEW1.DATABINDINGS.ADD (contact);
treenodebinding genre = new TreeNodeBinding ();
Genre. DataMember = "genre";//Add to bind with "region"
Genre. Valuefield = "name";
This. TREEVIEW1.DATABINDINGS.ADD (genre);
treenodebinding person = new treenodebinding ();
Person. DataMember = "person";//Add and "owner" binding
Person. Valuefield = "Text";
This. TREEVIEW1.DATABINDINGS.ADD (person);
TreeNodeBinding name = new TreeNodeBinding ();
Name. DataMember = "name";//Add to Binding
Name. Valuefield = "#InnerText";
This. TREEVIEW1.DATABINDINGS.ADD (name);
treenodebinding sex = new treenodebinding ();
Sex. DataMember = "sex";//Add with "gender" binding
Sex. Valuefield = "#InnerText";
This. TREEVIEW1.DATABINDINGS.ADD (Sex);
TreeNodeBinding age = new TreeNodeBinding ();
Age. DataMember = "Age";
Age. Valuefield = "#InnerText";
This. TREEVIEW1.DATABINDINGS.ADD (age);
TreeNodeBinding address = new TreeNodeBinding ();
Address. DataMember = "Address";//Add to bind
Address. Valuefield = "#InnerText";
This. TREEVIEW1.DATABINDINGS.ADD (address);
}
}
</script>
<title>treeview binding XML Sample </title>
<body>
<form id= "Form1" runat= "Server" >
<div>
<asp:xmldatasource id= "XmlDataSource1" runat= "Server"
datafile= "~/app_data/xmlfile.xml" >
</asp:XmlDataSource>
</div>
<asp:treeview id= "TreeView1" runat= "Server"
Datasourceid= "XmlDataSource1" >
</asp:TreeView>
</form>
</body>

(6) Press Ctrl+f5 key combination to run the program, the results shown in the following figure.

Source program Interpretation

(1) The TreeNodeBinding class defines the relationship between a data item in the TreeView control and the node to which the data item is bound. The DataMember property of the class specifies the node of the XML that corresponds to the data source displayed in the node. The Valuefield property corresponds to the Value property of the TreeNode object.

(2) The TreeNodeBinding class's Text property specifies the text to be displayed to the user, and the default is the same as the Valuefield property if the property is not specified.

(3) The DataSourceID property of the TreeView control specifies the source ID of the data source control.

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Related Keywords:
asp net blog source code asp net source code examples asp net practical examples implementation of data structures e commerce website in asp net source code free download asp net mvc 5 projects with source code free download asp net projects with source code and documentation free download
Related Article
ASP. NET core combined with consul cluster &docker to rea...
ASP. NET Core SignalR uses a generic hub to gracefully invoke...
ASP. NET Core 2.0 leverages Masstransit integrated RABBITMQ
Integration testing of ASP. NET Core Webapi using Xunit
CKEDITOR + CKFINDER image upload configuration (C #/asp.net/php)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More