
I have a Treeviiew inside an usercontrol. On my page i have this user control and a Grid. I am trying to implement the Drag and drop from Tree to the Grid. But the
'RadTreeView_NodeDrop'
event in the UserControl does not fire in this case. If the tree is not in an user control but directrly on the Page it works fine. Is it that the since its in user control the Node Drop does not fire or internally the Drop gets cancelled as soon as the Drop goes outside the user control containing the Treeview. Is there a work around for this? Thanks.
3 Answers, 1 is accepted
Could you, please, post the code of the user control and a simple page which reproduces this behavior?
Thanks!
This way I can, probably, resolve this for you and post back the page with working as expected drag and drop.
Hope that soon we will resolve this on for you!
Regards,
Nikolay Tsenkov
the Telerik team

Problem:
The event Handler:
CtrlTreeView1_RadTreeView1_NodeDropdoes not fire. Even if we declare our own custom event in the user control and raise it on NodeDrop from usercontrol and listen that in the page, the Node Drop inside the control also does not get fired.
Here is the code:
UserControl with the Treeview
Markup:
<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="CtrlTreeView.ascx.vb"
Inherits="Sample.CtrlTreeView" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<div>
<script language="javascript" type="text/javascript">
function ClientNodeClicked(sender, eventArgs) {
var node = eventArgs.get_node();
node.toggle();
}
</script>
<telerik:RadTreeView ID="RadTreeView1" runat="server" EnableDragAndDrop="True" ExpandMode="ClientSide" OnNodeDataBound="RadTreeView1_NodeDataBound"
OnClientNodeClicked="ClientNodeClicked">
<%--<NodeTemplate> user can user it for their own style
<a>
<%# DataBinder.Eval(Container, "Text")%>
</a>
</NodeTemplate>--%>
</telerik:RadTreeView>
</div>
vb:
Imports Telerik.Web.UI
Public Class CtrlTreeView
Inherits System.Web.UI.UserControl
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim objPage As BasePage
If Not Page.IsPostBack Then
Dim dt As DataTable
If Me.Parent IsNot Nothing AndAlso TypeOf Me.Page Is BasePage Then
objPage = DirectCast(Me.Page, BasePage)
dt = objPage.GetDataFromStore(EnumECEnt.EnmAppStorage.Application, C_APP_DATA_DSMODULEMANAGER)
RadTreeView1.DataSource = dt
RadTreeView1.DataTextField = "Name"
RadTreeView1.DataFieldParentID = "ParentID"
RadTreeView1.DataFieldID = "ID"
RadTreeView1.DataBind()
End If
End If
End Sub
Protected Sub RadTreeView1_NodeDataBound(ByVal sender As Object, ByVal e As RadTreeNodeEventArgs) Handles RadTreeView1.NodeDataBound
e.Node.ToolTip = (DirectCast(e.Node.DataItem, DataRowView))("TOOLTIP").ToString()
e.Node.ImageUrl = (DirectCast(e.Node.DataItem, DataRowView))("Normal_Icon").ToString()
e.Node.HoveredImageUrl = (DirectCast(e.Node.DataItem, DataRowView))("Hover_Icon").ToString()
e.Node.SelectedImageUrl = (DirectCast(e.Node.DataItem, DataRowView))("SELECTED_ICON").ToString()
e.Node.Attributes.Add("Type", DirectCast(e.Node.DataItem, DataRowView).Row("TYPE"))
If DirectCast(e.Node.DataItem, DataRowView).Row("TYPE") <> "FEATURE" Then
e.Node.AllowDrag = False
Else
e.Node.AllowDrag = True
End If
End Sub
End Class
Page in which am using the above Control
Markup:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="Sample.WebForm1" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register src="../Modules/Tools/UI/CtrlTreeView.ascx" tagname="CtrlTreeView" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<uc1:CtrlTreeView ID="CtrlTreeView1" runat="server" />
<telerik:RadGrid ID="RadGrid1" runat="server">
</telerik:RadGrid>
</div>
</form>
</body>
</html>
vb:
Public Class WebForm1
Inherits System.Web.UI.Page
Private Sub WebForm1_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
AddHandler CtrlTreeView1.RadTreeView1.NodeDrop, AddressOf CtrlTreeView1_RadTreeView1_NodeDrop
End Sub
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
End Sub
Private Sub CtrlTreeView1_RadTreeView1_NodeDrop(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadTreeNodeDragDropEventArgs)
MsgBox("Drop over")
End Sub
End Class
Sorry for the late response.
I have modified your code just a little bit and the handler for nodeDrop worked!
Basically, all I did, is to add a public property for the RadTreeView1 instance in the user control, and some minor changes on the dataSource (hardcoded it) and some other small modifications that enabled me to run and test the solution.
Here is how it looks now:
1. user control markup:
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<
div
>
<
script
language
=
"javascript"
type
=
"text/javascript"
>
function ClientNodeClicked(sender, eventArgs) {
var node = eventArgs.get_node();
node.toggle();
}
</
script
>
<
asp:ScriptManager
runat
=
"server"
ID
=
"ScriptManager1"
/>
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
EnableDragAndDrop
=
"True"
ExpandMode
=
"ClientSide"
OnNodeDataBound
=
"RadTreeView1_NodeDataBound"
OnClientNodeClicked
=
"ClientNodeClicked"
>
<%--<
NodeTemplate
> user can user it for their own style
<
a
>
<%# DataBinder.Eval(Container, "Text")%>
</
a
>
</
NodeTemplate
>--%>
</
telerik:RadTreeView
>
</
div
>
Public
Property
TreeView
As
RadTreeView
Get
Return
Me
.RadTreeView1
End
Get
Set
(
ByVal
value
As
RadTreeView)
End
Set
End
Property
Protected
Sub
Page_Load(
ByVal
sender
As
Object
,
ByVal
e
As
System.EventArgs)
Handles
Me
.Load
If
Not
Page.IsPostBack
Then
Dim
dataTable
As
DataTable =
New
DataTable()
dataTable.Columns.Add(
"FOBName"
)
dataTable.Columns.Add(
"FOBID"
)
dataTable.Columns.Add(
"ParentID"
)
dataTable.Columns.Add(
"IsChecked"
)
Dim
element
As
String
() = {
"root node1"
,
"1"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"root node2"
,
"2"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"root node3"
,
"3"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"root node4"
,
"4"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"root node5"
,
"5"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"root node6"
,
"6"
,
Nothing
,
"false"
}
dataTable.Rows.Add(element)
element = {
"node11"
,
"7"
,
"1"
,
"false"
}
dataTable.Rows.Add(element)
RadTreeView1.DataSource = dataTable
RadTreeView1.DataTextField =
"FOBName"
RadTreeView1.DataFieldParentID =
"ParentID"
RadTreeView1.DataFieldID =
"FOBID"
RadTreeView1.DataBind()
End
If
End
Sub
Protected
Sub
RadTreeView1_NodeDataBound(
ByVal
sender
As
Object
,
ByVal
e
As
RadTreeNodeEventArgs)
Handles
RadTreeView1.NodeDataBound
End
Sub
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register src="345164 - nodeDrop treeView in userControl.ascx" tagname="CtrlTreeView" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
id
=
"Head1"
runat
=
"server"
>
<
title
></
title
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
div
>
<
uc1:CtrlTreeView
ID
=
"CtrlTreeView1"
runat
=
"server"
/>
<
telerik:RadGrid
ID
=
"RadGrid1"
runat
=
"server"
>
</
telerik:RadGrid
>
</
div
>
</
form
>
</
body
>
</
html
>
4. page code-behind:
Private
Sub
WebForm1_Init(
ByVal
sender
As
Object
,
ByVal
e
As
System.EventArgs)
Handles
Me
.Init
AddHandler
CtrlTreeView1.TreeView.NodeDrop,
AddressOf
CtrlTreeView1_RadTreeView1_NodeDrop
End
Sub
Protected
Sub
Page_Load(
ByVal
sender
As
Object
,
ByVal
e
As
System.EventArgs)
Handles
Me
.Load
End
Sub
Private
Sub
CtrlTreeView1_RadTreeView1_NodeDrop(
ByVal
sender
As
Object
,
ByVal
e
As
Telerik.Web.UI.RadTreeNodeDragDropEventArgs)
MsgBox(
"Drop over"
)
End
Sub
I hope this is helpful for you!
If there are some further complications with this, please, contact with us again! We will be happy to help!
Regards,
Nikolay Tsenkov
the Telerik team