<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.TreeListExamplesCSharp.ItemsDragDrop.DefaultCS" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<link href="styles.css" rel="stylesheet" />
<script type="text/javascript" src="scripts.js"></script>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<qsf:MessageBox ID="IDBox1" Icon="Info" runat="server" >
Move operation is supported only when dragged item is expanded. If it is not,
the code will fallback to (non-recursive) copy operation.
</qsf:MessageBox>
<telerik:RadAjaxManager runat="server" ID="RadAjaxManager1" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="ConfigurationPanel1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadTreeList1" />
<telerik:AjaxUpdatedControl ControlID="RadTreeList2" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="RadTreeList1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadTreeList1" />
<telerik:AjaxUpdatedControl ControlID="RadTreeList2" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="RadTreeList2">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadTreeList1" />
<telerik:AjaxUpdatedControl ControlID="RadTreeList2" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"></telerik:RadAjaxLoadingPanel>
<div class="demo-container">
<div class="left">
<telerik:RadTreeList RenderMode="Lightweight" ID="RadTreeList1" runat="server" AllowPaging="True" DataSourceID="SqlDataSource1" DataKeyNames="EmployeeID" ParentDataKeyNames="ParentEmployeeID" AutoGenerateColumns="false" AllowRecursiveDelete="true" Width="500px" PageSize="6" OnItemCommand="RadTreeList1_ItemCommand">
<PagerStyle Mode="NumericPages"></PagerStyle>
<Columns>
<telerik:TreeListDragDropColumn Visible="false" HeaderStyle-Width="20px" UniqueName="TreeListDragDropColumn"></telerik:TreeListDragDropColumn>
<telerik:TreeListTemplateColumn HeaderText="Source" DataField="FirstName">
<ItemTemplate>
<table class="templateTable">
<tr>
<td class="templateHeader">
<asp:Label ID="lblFirstName" runat="server" Text='<%# Bind("FirstName") %>'></asp:Label>
<asp:Label ID="lblMiddleName" runat="server" Text='<%# Bind("MiddleName") %>'></asp:Label>
<asp:Label ID="lblLastName" runat="server" Text='<%# Bind("LastName") %>'></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblPhone" runat="Server" Text='<%# Bind("Phone") %>'></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblCity" runat="server" Text='<%# Bind("City") %>'></asp:Label>
<asp:Label ID="lblAddress" runat="server" Text='<%# Bind("Address") %>'></asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
</telerik:TreeListTemplateColumn>
</Columns>
<ClientSettings AllowItemsDragDrop="true">
<Selecting AllowItemSelection="True"></Selecting>
<ClientEvents OnItemDropping="itemDropping" OnItemDragging="itemDragging" OnTreeListCreated="function(sender) { treeList1 = sender; }"></ClientEvents>
</ClientSettings>
</telerik:RadTreeList>
</div>
<div class="right">
<telerik:RadTreeList RenderMode="Lightweight" ID="RadTreeList2" runat="server" AllowPaging="True" DataSourceID="SqlDataSource2" DataKeyNames="EmployeeID" ParentDataKeyNames="ManagerID" AutoGenerateColumns="false" ClientDataKeyNames="EmployeeID" PageSize="6" Width="500px">
<PagerStyle Mode="NumericPages"></PagerStyle>
<Columns>
<telerik:TreeListDragDropColumn Visible="false" HeaderStyle-Width="20px" UniqueName="TreeListDragDropColumn"></telerik:TreeListDragDropColumn>
<telerik:TreeListTemplateColumn HeaderText="Target">
<ItemTemplate>
<table id="Table1" class="templateTable" runat="server">
<tr>
<td class="templateHeader">
<asp:Label ID="lblFirstName" runat="server" Text='<%# Bind("FirstName") %>'></asp:Label>
<asp:Label ID="lblMiddleName" runat="server" Text='<%# Bind("MiddleName") %>'></asp:Label>
<asp:Label ID="lblLastName" runat="server" Text='<%# Bind("LastName") %>'></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblPhone" runat="Server" Text='<%# Bind("Phone") %>'></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblCity" runat="server" Text='<%# Bind("City") %>'></asp:Label>
<asp:Label ID="lblAddress" runat="server" Text='<%# Bind("Address") %>'></asp:Label>
</td>
</tr>
</table>
</ItemTemplate>
</telerik:TreeListTemplateColumn>
</Columns>
<ClientSettings AllowItemsDragDrop="true">
<Selecting AllowItemSelection="True"></Selecting>
<ClientEvents OnItemDropping="itemDropping" OnItemDragging="itemDragging" OnTreeListCreated="function(sender) { treeList2 = sender; }"></ClientEvents>
</ClientSettings>
</telerik:RadTreeList>
</div>
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:SelfReferencingDbConnectionString %>" SelectCommand="SELECT [EmployeeID], [ParentEmployeeID], [FirstName], [MiddleName], [LastName], [Phone], [Address], [City] FROM [TelerikEmployees]" DeleteCommand="DELETE FROM [TelerikEmployees] WHERE [EmployeeID] = @EmployeeID" InsertCommand="INSERT INTO [TelerikEmployees] ([ParentEmployeeID]) VALUES (@ParentEmployeeID)" UpdateCommand="UPDATE [TelerikEmployees] SET [ParentEmployeeID] = @ParentEmployeeID WHERE [EmployeeID] = @EmployeeID">
<DeleteParameters>
<asp:Parameter Name="EmployeeID" Type="Int32"></asp:Parameter>
</DeleteParameters>
<InsertParameters>
<asp:Parameter Name="ParentEmployeeID" Type="Int32"></asp:Parameter>
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="ParentEmployeeID" Type="Int32"></asp:Parameter>
<asp:Parameter Name="EmployeeID" Type="Int32"></asp:Parameter>
</UpdateParameters>
</asp:SqlDataSource>
<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:SelfReferencingDbConnectionString %>" SelectCommand="SELECT [EmployeeID], [FirstName], [MiddleName], [LastName], [ManagerID], [Address], [City], [Phone] FROM [EmployeesNew]" DeleteCommand="DELETE FROM [EmployeesNew] WHERE [EmployeeID] = @EmployeeID" InsertCommand="INSERT INTO [EmployeesNew] ([ManagerID]) VALUES (@ManagerID)" UpdateCommand="UPDATE [EmployeesNew] SET [ManagerID] = @ManagerID WHERE [EmployeeID] = @EmployeeID">
<DeleteParameters>
<asp:Parameter Name="EmployeeID" Type="Int32"></asp:Parameter>
</DeleteParameters>
<InsertParameters>
<asp:Parameter Name="ManagerID" Type="Int32"></asp:Parameter>
</InsertParameters>
<UpdateParameters>
<asp:Parameter Name="ManagerID" Type="Int32"></asp:Parameter>
<asp:Parameter Name="EmployeeID" Type="Int32"></asp:Parameter>
</UpdateParameters>
</asp:SqlDataSource>
<qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1" Title="Demo Configurator">
<Views>
<qsf:View>
<qsf:ConfiguratorColumn runat="server" Title="Select this checkbox to toggle between copy/move mode.">
<ul class="fb-group">
<li>
<span class="checkbox">
<asp:CheckBox AutoPostBack="true" runat="server" ID="MoveItemsCheckBox" Text="Move dragged items"></asp:CheckBox>
</span>
</li>
<li>
<span class="checkbox">
<asp:CheckBox AutoPostBack="true" runat="server" ID="ShowDragColumnCheckBox" Text="Show DragDrop Column" OnCheckedChanged="ShowDragColumnCheckBox_CheckedChanged"></asp:CheckBox>
</span>
</li>
</ul>
</qsf:ConfiguratorColumn>
</qsf:View>
</Views>
</qsf:ConfiguratorPanel>
</form>
</body>
</html>