ASP.NET Tutorial/ASP.net Controls/TreeView

Материал из .Net Framework эксперт
Версия от 12:00, 26 мая 2010; Admin (обсуждение | вклад) (1 версия)
(разн.) ← Предыдущая | Текущая версия (разн.) | Следующая → (разн.)
Перейти к: навигация, поиск

Binding to an XML File

File: Data.xml
<movies>
  <action>
    <StarWars />
    <IndependenceDay />
  </action>
  <horror>
    <Jaws />
    <NightmareBeforeChristmas />
  </horror>
</movies>

File: TreeViewXml.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView XML</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TreeView
        id="TreeView1"
        DataSourceID="srcMovies"
        Runat="server" />
    <asp:XmlDataSource
        id="srcMovies"
        DataFile="~/Data.xml"
        Runat="server" />
    </div>
    </form>
</body>
</html>


Complex tree view

File: Data.xml
<movies>
  <category id="category1" text="Action">
    <movie id="movie1" text="Star Wars" />
    <movie id="movie2" text="Independence Day" />
  </category>
  <category id="category2" text="Horror">
    <movie id="movie3" text="Jaws" />
    <movie id="movie4" text="Nightmare Before Christmas" />
  </category>
</movies>

File: TreeViewXMLComplex.aspx
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView XML Complex</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TreeView
        id="TreeView1"
        DataSourceID="srcMovies"
        Runat="server">
        <DataBindings>
        <asp:TreeNodeBinding
            DataMember="category"
            TextField="text"
            ValueField="id" />
        <asp:TreeNodeBinding
            DataMember="movie"
            TextField="text"
            ValueField="id" />
        </DataBindings>
    </asp:TreeView>
    <asp:XmlDataSource
        id="srcMovies"
        DataFile="~/Data.xml"
        Runat="server" />
    </div>
    </form>
</body>
</html>


Displaying a Site Map with a TreeView control.

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView Site Map</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TreeView
        id="TreeView1"
        DataSourceID="srcSiteMap"
        Runat="server" />
    <asp:SiteMapDataSource
        id="srcSiteMap"
        Runat="server" />
    </div>
    </form>
</body>
</html>

File: Web.sitemap
<siteMap xmlns="http://schemas.microsoft.ru/AspNet/SiteMap-File-1.0" >
<siteMapNode
  url="Default.aspx"
  title="Home"
  description="The Home Page">
  <siteMapNode
    url="Products/Default.aspx"
    title="Our Products"
    description="Products that we offer">
    <siteMapNode
      url="Products/FirstProduct.aspx"
      title="First Product"
      description="The description of the First Product" />
    <siteMapNode
      url="Products/SecondProduct.aspx"
      title="Second Product"
      description="The description of the Second Product" />
  </siteMapNode>
  <siteMapNode
    url="Services/Default.aspx"
    title="Our Services"
    description="Services that we offer">
    <siteMapNode
      url="Services/FirstService.aspx"
      title="First Service"
      description="The description of the First Service"
      metaDescription="The first service" />
    <siteMapNode
      url="Services/SecondService.aspx"
      title="Second Service"
      description="The description of the Second Service" />
  </siteMapNode>
</siteMapNode>
</siteMap>


Displaying TreeView check boxes.

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">
    protected void btnSubscribe_Click(object sender, EventArgs e)
    {
        foreach (TreeNode node in TreeView1.CheckedNodes)
            bltSubscribed.Items.Add(node.Text);
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView CheckBoxes</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    Select the Newsgroups which you
    would like to join:
    <br />
    <asp:TreeView
        id="TreeView1"
        ShowCheckBoxes="Leaf"
        Runat="server">
        <Nodes>
        <asp:TreeNode
            Text="Programming">
            <asp:TreeNode Text="ASP.NET" />
            <asp:TreeNode Text="JAVA" />
            <asp:TreeNode Text="Cold Fusion" />
        </asp:TreeNode>
        <asp:TreeNode
            Text="Sports">
            <asp:TreeNode Text="Baseball" />
            <asp:TreeNode Text="Hockey" />
            <asp:TreeNode Text="Football" />
        </asp:TreeNode>
        </Nodes>
    </asp:TreeView>
    <br />
    <asp:Button
        id="btnSubscribe"
        Text="Subscribe"
        OnClick="btnSubscribe_Click"
        Runat="server" />
    <hr />
    You selected:
    <asp:BulletedList
        id="bltSubscribed"
        EnableViewState="false"
        Runat="server" />
    </div>
    </form>
</body>
</html>


Selecting a TreeView node.

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">
    protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e)
    {
        lblMessage.Text = TreeView1.SelectedValue;
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView Value</title>
</head>
<body>
    <form id="form1" runat="server">
    <div class="content">
    <asp:TreeView
        id="TreeView1"
        OnSelectedNodeChanged="TreeView1_SelectedNodeChanged"
        Runat="server" >
        <Nodes>
        <asp:TreeNode
            Text="Home"
            Value="Home">
            <asp:TreeNode
                Text="Products">
                <asp:TreeNode
                    Text="First Product"
                    Value="FirstProduct" />
                <asp:TreeNode
                    Text="Second Product"
                    Value="SecondProduct" />
            </asp:TreeNode>
            <asp:TreeNode
                Text="Services">
                <asp:TreeNode
                    Text="First Service"
                    Value="FirstService" />
                <asp:TreeNode
                    Text="Second Service"
                    Value="SecondService" />
            </asp:TreeNode>
        </asp:TreeNode>
        </Nodes>
    </asp:TreeView>
    </div>
    <div class="content">
    You selected:
    <asp:Label
        id="lblMessage"
        EnableViewState="false"
        Runat="server" />
    </div>
    </form>
</body>
</html>


Tree style with XML data

<%@ page language="VB" %>
<script runat="server">
</script>
<html>
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form runat="server">
        <asp:treeview id="TreeView1" 
                      runat="server" 
                      font-underline="False" 
                      datasourceid="XmlDataSource1"
                      font-names="Tahoma" 
                      font-size="8pt" 
                      font-italic="False" 
                      font-bold="False" 
                      imageset="XP_Explorer"
                      forecolor="Black" 
                      nodeindent="15" 
                      autogeneratebindings="False">
            <selectednodestyle backcolor="#B5B5B5" 
                               font-underline="False" 
                               font-italic="False"
                               font-bold="False">
            </selectednodestyle>
            <hovernodestyle forecolor="#6666AA" 
                            font-underline="True" 
                            font-italic="False" 
                            font-bold="False">
            </hovernodestyle>
            <bindings>
                <asp:treenodebinding value="My Bookstore" depth="0" text="My Bookstore">
                </asp:treenodebinding>
                <asp:treenodebinding datamember="genre" textfield="name" depth="1">
                </asp:treenodebinding>
                <asp:treenodebinding datamember="book" textfield="isbn" depth="2">
                </asp:treenodebinding>
            </bindings>
            <parentnodestyle font-underline="False" font-italic="False" font-bold="False">
            </parentnodestyle>
            <leafnodestyle font-underline="False" font-italic="False" font-bold="False">
            </leafnodestyle>
            <nodestyle forecolor="Black" 
                       verticalpadding="2" 
                       horizontalpadding="2" 
                       font-underline="False"
                       font-names="Tahoma" 
                       font-size="8pt" 
                       font-italic="False" 
                       font-bold="False">
            </nodestyle>
            <rootnodestyle font-underline="False" font-italic="False" font-bold="False">
            </rootnodestyle>
        </asp:treeview>
        <asp:xmldatasource id="XmlDataSource1" runat="server" datafile="Data.xml">
        </asp:xmldatasource>
    </form>
</body>
</html>
File: Data.xml
<?xml version="1.0" standalone="yes"?>
<bookstore>
  <genre name="fiction">
    <book ISBN="10-000000-001">
      <title>title 1</title>
      <price>12.95</price>
      <comments>
        <userComment rating="4">
           comment 1
        </userComment>
        <userComment rating="2">
           comment 2
        </userComment>
      </comments>
    </book>
  </genre>
</bookstore>


Tree view event

<%@ page language="C#" %>
<%@ import namespace="System.IO" %>
<script runat="server" language="c#">
void TreeView1_TreeNodePopulate(object sender, System.Web.UI.WebControls.TreeNodeEventArgs e)
{
    if (e.Node.ChildNodes.Count == 0) {    
        this.LoadChildNodes(e.Node);
    }
}    
    
private void LoadChildNodes(TreeNode node) {    
    DirectoryInfo directory;
    if (node.ValuePath.Length == 0) {
        directory = new DirectoryInfo(node.Value);
    } else {
        directory = new DirectoryInfo(node.ValuePath);
    }
    foreach(DirectoryInfo subDirectory in directory.GetDirectories()) {
        TreeNode subNode = new TreeNode(subDirectory.Name);
        subNode.PopulateOnDemand = true;
        subNode.SelectAction = TreeNodeSelectAction.SelectExpand;
        node.ChildNodes.Add(subNode);
    }
}
</script>

<html>
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form runat="server">
        <asp:treeview id="TreeView1" 
                      runat="server" 
                      font-underline="False" 
                      font-names="Tahoma"
                      font-size="8pt" 
                      font-italic="False" 
                      font-bold="False" 
                      imageset="XP_Explorer"
                      forecolor="Black" 
                      nodeindent="15" 
                      ontreenodepopulate="TreeView1_TreeNodePopulate">
            <selectednodestyle backcolor="#B5B5B5" 
                               font-underline="False" 
                               font-italic="False"
                               font-bold="False">
            </selectednodestyle>
            <hovernodestyle forecolor="#6666AA" 
                            font-underline="True" 
                            font-italic="False" 
                            font-bold="False">
            </hovernodestyle>
            <parentnodestyle font-underline="False" font-italic="False" font-bold="False">
            </parentnodestyle>
            <leafnodestyle font-underline="False" font-italic="False" font-bold="False">
            </leafnodestyle>
            <nodes>
                <asp:treenode checked="True" 
                              value="c:\" 
                              populateondemand="True" 
                              showcheckbox="False"
                              selectaction="SelectExpand" 
                              selected="True" 
                              text="Drive C:\">
                </asp:treenode>
            </nodes>
            <nodestyle forecolor="Black" 
                       verticalpadding="2" 
                       horizontalpadding="2" 
                       font-underline="False"
                       font-names="Tahoma" 
                       font-size="8pt" 
                       font-italic="False" 
                       font-bold="False">
            </nodestyle>
            <rootnodestyle font-underline="False" font-italic="False" font-bold="False">
            </rootnodestyle>
        </asp:treeview>
    </form>
</body>
</html>


Tree view style

<%@ page language="VB" %>
<script runat="server">
</script>
<html>
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form runat="server">
        <asp:treeview id="TreeView1" 
                      runat="server" 
                      font-underline="False" 
                      font-names="Verdana"
                      font-size="8pt" 
                      font-italic="False" 
                      font-bold="False" 
                      imageset="MSDN" 
                      forecolor="#000000"
                      nodeindent="16" 
                      backcolor="#EEEEEE">
            <selectednodestyle verticalpadding="1" 
                               bordercolor="#999999" 
                               horizontalpadding="3"
                               backcolor="#FFFFFF" 
                               font-underline="False" 
                               font-italic="False" 
                               font-bold="False"
                               borderwidth="1px" 
                               borderstyle="Solid">
            </selectednodestyle>
            <hovernodestyle verticalpadding="1" 
                            bordercolor="#999999" 
                            horizontalpadding="3" 
                            backcolor="#C7C7C7"
                            font-underline="True" 
                            font-italic="False" 
                            font-bold="False" 
                            borderwidth="1px"
                            borderstyle="Solid">
            </hovernodestyle>
            <parentnodestyle font-underline="False" font-italic="False" font-bold="False">
            </parentnodestyle>
            <leafnodestyle font-underline="False" font-italic="False" font-bold="False">
            </leafnodestyle>
            <nodes>
                <asp:treenode checked="True" 
                              value="My Root Element" 
                              expanded="True" 
                              text="My Root Element">
                    <asp:treenode value="My Child Element" text="My Child Element">
                    </asp:treenode>
                    <asp:treenode checked="True" 
                                  value="Another Child" 
                                  expanded="True" 
                                  showcheckbox="False"
                                  selectaction="SelectExpand" 
                                  selected="True" 
                                  text="Another Child">
                        <asp:treenode value="A Childs Child" 
                                      selectaction="None" 
                                      text="A Childs Child">
                        </asp:treenode>
                    </asp:treenode>
                </asp:treenode>
            </nodes>
            <nodestyle forecolor="#000000" 
                       verticalpadding="2" 
                       nodespacing="1" 
                       horizontalpadding="4"
                       font-underline="False" 
                       font-names="Verdana" 
                       font-size="8pt" 
                       font-italic="False"
                       font-bold="False">
            </nodestyle>
            <rootnodestyle font-underline="False" font-italic="False" font-bold="False">
            </rootnodestyle>
        </asp:treeview>&nbsp;
    </form>
</body>
</html>


Using the TreeView Control

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>TreeView Declare</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TreeView
        id="TreeView1"
        Runat="server">
        <Nodes>
        <asp:TreeNode
            Text="Home"
            NavigateUrl="~/Default.aspx">
            <asp:TreeNode
                Text="Products">
                <asp:TreeNode
                    Text="First Product"
                    NavigateUrl="~/Products/FirstProduct.aspx" />
                <asp:TreeNode
                    Text="Second Product"
                    NavigateUrl="~/Products/SecondProduct.aspx" />
           </asp:TreeNode>
           <asp:TreeNode
               Text="Services">
               <asp:TreeNode
                   Text="First Service"
                   NavigateUrl="~/Services/FirstService.aspx" />
               <asp:TreeNode
                   Text="Second Service"
                   NavigateUrl="~/Services/SecondService.aspx" />
            </asp:TreeNode>
        </asp:TreeNode>
        </Nodes>
    </asp:TreeView>

    </div>
    </form>
</body>
</html>
Источник — «http://nfex.ru/index.php?title=ASP.NET_Tutorial/ASP.net_Controls/TreeView&oldid=3413»