This is a migrated thread and some comments may be shown as answers.

DnD Node into Custom Control Node

3 Answers 52 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
PCS
Top achievements
Rank 1
PCS asked on 04 Apr 2012, 09:54 AM
Hi 

I have an issue I hope someone can help with. I have two tree's (Source, Destination). Source contains simple text nodes in a hierarchical format (fields from a form)

Source Tree
- Application
- Properties
Age of Applicant
Mobile Phone

The destination tree is made up on nodes containing custom controls. I create them on the fly using Node.Controls.Add(customControl). I rebuild the Destination tree on each Postback so that the tree remains consistent.

Destination Tree

- Root (Custom Control in Node - Label)
- Process 1 (Custom Control in Node - No Fields)
Action 1 (Custom Control in Node - Text Box, Labels)
Query 1 (Custom Control in Node - Text Boxes, Labels)

Inside my Action 1 custom control I have various fields. I need to be able to drag a node from Source onto the Text field held in the Custom Control contained within the node on the Destination tree.

So far nothing has worked. Dragging from Source to Destination only triggers the Destination Node on drop (so I don't know which Custom Control field it was dropped onto - Html, and I don't get anything from HtmlElementID when dropping over the actual field.

I've tried disabling Drop on the Destination Nodes (in the hope that the custom control fields could then be seen) but this didn't work, as it brings up the Can't Drop icon.

Is this possible with the current Telerik controls?

Thanks

Steve

3 Answers, 1 is accepted

Sort by
0
Plamen
Telerik team
answered on 09 Apr 2012, 06:58 AM
Hello Steve,

 
Such behavior is not implemented in the drag and drop functionality of RadTreeView because the drop event is not fired each time due to the html that is generated in the node.

It is also not very clear what should be the expected behavior when you drop a node on such template. You can refer to our Drag and Drop demo and review how the different drops are working usually.

Would you please explain what exactly are you trying to achieve when the node is dropped on the textbox and on the destination node area?
  

Kind regards,
Plamen Zdravkov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
PCS
Top achievements
Rank 1
answered on 09 Apr 2012, 04:31 PM
You already support drag and drop to a HTML Element. You demo of it is here:

http://www.telerik.com/help/aspnet-ajax/treeview-drag-and-drop-to-html.html

All I'm doing is adding a custom control that contains HTML elements (text boxes, asp Panels) to each tree node. When another tree node is drag to the tree node containing the HTML element, I want the HtmlElementID is populated. Right now, only the DestNode field is populated. The drop does not go into the tree node custom control to select the actual Html Element the node was dropped onto.

In short, I would like the Html Elements contained within a tree node to be drop targets, rather than just the entire containing node from swallowing the drop request.

Thanks

Steve
0
Plamen
Telerik team
answered on 11 Apr 2012, 12:22 PM
Hi Steve,

 
If you want to use the server event you can find the control by using the FindControl property RadTreeNode as in the code bellow that I added to our on-line demo and it worked as expected at my side:

protected void RadTreeView1_HandleDrop(object sender, RadTreeNodeDragDropEventArgs e)
        {
           TextBox a= e.DestDragNode.FindControl("TB") as TextBox;
           a.Text = e.SourceDragNode.Text;
<NodeTemplate>
                        <asp:TextBox runat="server" ID="TB" />
                     
                        <asp:Label Text="text" runat="server" />
                    </NodeTemplate>

You can also consider using the client onNodeDropping event as in the code bellow :
function onNodeDropping(sender, args)
                {  
                    var dest = args.get_destNode();
                    var element = args.get_htmlElement();
                    if (dest && element.tagName.toUpperCase() == "INPUT") {
                       dropOnHtmlElement(args);
                      args.set_cancel(true);
                      return;
                    }

Hope some of these solutions will be help you.

Regards,
Plamen Zdravkov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
TreeView
Asked by
PCS
Top achievements
Rank 1
Answers by
Plamen
Telerik team
PCS
Top achievements
Rank 1
Share this question
or