<%@ Register TagPrefix="ecd" Namespace="ASPNETExpert.WebControls.DemoControls" Assembly="ASPNETExpert.WebControls.DemoControls" %>
<%@ Register TagPrefix="ec" Namespace="ASPNETExpert.WebControls" Assembly="ASPNETExpert.WebControls" %>
<%@ Control Language="c#" AutoEventWireup="True" Codebehind="MultipleSelection.ascx.cs" Inherits="ASPNETExpert.WebControls.Demo.Tree.Programming.MultipleSelection" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<script language="javascript">
function FillSelectedNodes() {
var elem = document.getElementById("SelectedNodesList");
if(elem)
elem.innerHTML = '<p>' + GetSelectedNodesHTML() + '</p>';
}
function GetSelectedNodesHTML() {
var result = '';
var tree = ec_GetTree('<%=MultipleNodeSelectionTree.UniqueID%>');
if(tree != null)
{
var selectedNodes = tree.GetSelectedNodes();
for(var node in selectedNodes)
result += '<b>' + selectedNodes[node].Text + '</b><br>';
}
return result;
}
</script>
<table cellpadding="0" cellspacing="5" border="0" xmlns:ec="urn:http://aspnetexpert.com/ExpertControls.xsd">
<tr>
<td valign=top>
<ec:ExpertTree id="MultipleNodeSelectionTree" Skin="XP" runat="server" SelectionMode="Multiple" ExpandOnClick="true" CollapseOnClick="true">
<TreeLook Width="260px" Height="380px" Overflow="Scroll" />
<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="220">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td><input type="button" value="Get Selected Nodes (Client)" onclick="FillSelectedNodes()"></td>
</tr>
<tr>
<td><asp:Button Runat=server ID="GetSelectedNodes" Text="Get Selected Nodes (Server)"></asp:Button></td>
</tr>
<tr>
<td width="220">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="SelectedNodesList" valign=top></td>
</tr>
<tr>
<td><asp:CheckBoxList Runat=server ID="SelectedNodes" DataSource="<%#MultipleNodeSelectionTree.SelectedNodes%>" AutoPostBack=False DataTextField="Path" Font-Names="Tahoma,Verdana,Arial" Font-Size="10"></asp:CheckBoxList></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td valign=top>
<ecd:DescriptionView runat="server" ID="Descriptionview1">
<ecd:Description id="Description1" runat="server">
Set <b>SelectionMode="Multiple"</b> for the tree if you want that a user
can select multiple nodes.
</ecd:Description>
<ecd:Description id="Description2" runat="server">
Use <b>Ctrl</b> or <b>Shift</b> key for multiple nodes selection.
</ecd:Description>
<ecd:Description id="Description3" runat="server">
You can get selected nodes at the server side with <b>SelectedNodes</b> property.
</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/MultipleSelection.ascx" ID="Syntaxhighlight1"/>
</pre>
</ec:TabItem>
<ec:TabItem runat="server" Text="C#" ID="Tabitem2">
<pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="C#" OutputFile="Programming/MultipleSelection.ascx.cs" ID="Syntaxhighlight2"/>
</pre>
</ec:TabItem>
<ec:TabItem runat="server" Text="VB" ID="Tabitem3">
<pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="VB" OutputFile="Programming/MultipleSelection_vb.ascx.vb" ID="Syntaxhighlight3"/>
</pre>
</ec:TabItem>
</ec:CodeViewTab>