ASP.NET Tree. ExpertTree - XML and CSS based DHTML Server-Side Tree Control for ASP.NET

<%@ Control Language="c#" AutoEventWireup="false" %>
<%@ Register TagPrefix="ec" Namespace="ASPNETExpert.WebControls" Assembly="ASPNETExpert.WebControls" %>
<%@ Register TagPrefix="ecd" Namespace="ASPNETExpert.WebControls.DemoControls" Assembly="ASPNETExpert.WebControls.DemoControls" %>
<table cellpadding="0" cellspacing="5" border="0" xmlns:ec="urn:http://aspnetexpert.com/ExpertControls.xsd">
  <tr>
    <td valign=top>
<ec:ExpertTree id="ExpandSingleBranchTree" Skin="XP" runat="server" ExpandSingleBranch="true" ExpandOnClick="true" CollapseOnClick="true">
  <TreeLook Width="200" Height="380px" Overflow="Scroll" />
  <Looks>
    <ec:TreeNodeLook Id="ParentAnimated" Base="Parent" BindStrategy="OverrideBaseBind">
      <SubTree>
        <Expand Effect="GlideTopToBottom" Duration="200" />
        <Collapse Effect="GlideTopToBottom" Duration="200" />
      </SubTree>
    </ec:TreeNodeLook>
  </Looks>
  <Nodes>
    <ec:TreeNode Expanded="true" Text="North America">
      <Nodes>
        <ec:TreeNode Expanded="true" Text="U.S.A.">
          <Nodes>
            <ec:TreeNode Text="New York" />
            <ec:TreeNode Text="Los Angeles" />
            <ec:TreeNode Text="Boston" Enabled="false" />
            <ec:TreeNode Text="Chicago" Enabled="false" />
          </Nodes>
        </ec:TreeNode>
        <ec:TreeNode Text="Canada">
          <Nodes>
            <ec:TreeNode Text="Toronto" />
            <ec:TreeNode Text="Vancouver" />
            <ec:TreeNode Text="Calgary" />
            <ec:TreeNode Text="Ottawa" />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="Mexico">
          <Nodes>
            <ec:TreeNode Text="Campeche" />
            <ec:TreeNode Text="Guadalajara" />
            <ec:TreeNode Text="Mexico City" />
            <ec:TreeNode Text="Puebla" />
          </Nodes>  
        </ec:TreeNode>
      </Nodes>
    </ec:TreeNode>
    <ec:TreeNode Text="Europe">
      <Nodes>
        <ec:TreeNode Text="England">
          <Nodes>
            <ec:TreeNode Text="London" />
            <ec:TreeNode Text="Liverpool" />
            <ec:TreeNode Text="Leeds" />
            <ec:TreeNode Text="Manchester" />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="France">
          <Nodes>
            <ec:TreeNode Text="Paris" />
            <ec:TreeNode Text="Cannes" />
            <ec:TreeNode Text="Grenoble" />
            <ec:TreeNode Text="Toulouse" />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="Germany">
          <Nodes>
            <ec:TreeNode Text="Berlin" />
            <ec:TreeNode Text="Bonn" />
            <ec:TreeNode Text="Bremen" />
            <ec:TreeNode Text="Munich" />
          </Nodes>  
        </ec:TreeNode>
      </Nodes>  
    </ec:TreeNode>
    <ec:TreeNode Text="South America">
      <Nodes>
        <ec:TreeNode Text="Brasil">
          <Nodes>
            <ec:TreeNode Text="Rio de Janeiro " />
            <ec:TreeNode Text="Sao Paulo" />
            <ec:TreeNode Text="Campinas" />
            <ec:TreeNode Text="Brasilia" />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="Argentina">
          <Nodes>
            <ec:TreeNode Text="Buenos Aires " />
            <ec:TreeNode Text="Cordoba" />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="Chile">
          <Nodes>
            <ec:TreeNode Text="Arica" />
            <ec:TreeNode Text="Copiapo" />
            <ec:TreeNode Text="Puerto Montt" />
          </Nodes>  
        </ec:TreeNode>
      </Nodes>  
    </ec:TreeNode>
    <ec:TreeNode Text="Africa">
      <Nodes>
        <ec:TreeNode Text="South Africa">
          <Nodes>
            <ec:TreeNode Text="Cape Town" />
            <ec:TreeNode Text="Johannesburg" />
            <ec:TreeNode Text="Pretoria " />
          </Nodes>  
        </ec:TreeNode>
        <ec:TreeNode Text="Zambia">
          <Nodes>
            <ec:TreeNode Text="Lusaka" />
          </Nodes>
        </ec:TreeNode>
        <ec:TreeNode Text="Zimbabwe">
          <Nodes>
            <ec:TreeNode Text="Harare" />
          </Nodes>  
        </ec:TreeNode>
      </Nodes>  
    </ec:TreeNode>
  </Nodes>      
</ec:ExpertTree>
    </td>
    <td valign=top width="100%" style="padding-left:10px;">
<ecd:DescriptionView runat="server" ID="Descriptionview1">
  <ecd:Description runat="server" ID="Description1">
Use <b>ExpandSingleBranch</b> boolean property to specify whether to collapse 
all other branches when expanding a node. Setting this property ensures that 
only one branch at any level is expanded.
  </ecd:Description>
  <ecd:Description runat="server" ID="Description3">
This demo also demonstrates how to override a <b>TreeNodeLook</b>: 
  <pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="ASPX">
<ec:TreeNodeLook Id="ParentAnimated" Base="Parent" 
      BindStrategy="OverrideBaseBind">
  <Expand Effect="GlideTopToBottom" Duration="200" />
  <Collapse Effect="GlideTopToBottom" Duration="200" />
</ec:TreeNodeLook>
</ecd:SyntaxHighlight>
  </pre>
The <b>Parent</b> look is defined in the built-in skin. Here <b>ParentAnimated</b>
look extends <b>Parent</b> with defining <b>Expand</b> and <b>Collapse</b> effects.
<b>BindStrategy="OverrideBaseBind"</b> means that it replaces <b>Parent</b> in 
the process of binding a node with <b>TreeNodeLook</b>.  
  </ecd:Description>
</ecd:DescriptionView>  
    </td>
  </tr>
</table>
<ec:CodeViewTab id="CodeViewTab1" runat="server">
  <ec:TabItem runat="server" Text="aspx" ID="Tabitem1">
    <pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="ASPX" OutputFile="Programming/ExpandSingleBranch.ascx" />
    </pre>
  </ec:TabItem>
</ec:CodeViewTab>