Dragging Node image and text

4 posts, 1 answers
  1. Karthikeyan
    Karthikeyan avatar
    7 posts
    Member since:
    Oct 2008

    Posted 04 Nov 2008 Link to this post


    Using Rad TreeView while dragging is it possible to drag both Node text and image/icon?
    Currently while dragging tree node it is displaying Node text only.

    Thanks & Regards,
  2. Answer
    Yana avatar
    4550 posts

    Posted 04 Nov 2008 Link to this post

    Hi Karthikeyan,

    You can achieve this functionality by using templates and adding the image there like this:

        <img src="Images/icon.gif" /><%#DataBinder.Eval(Container, "Text") %> 

    Best wishes,
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. DevCraft R3 2016 release webinar banner
  4. Chris May IT Team Lead
    Chris May IT Team Lead avatar
    31 posts
    Member since:
    Nov 2009

    Posted 03 May 2010 Link to this post


    I had the same issue: I want to display an image while dragging.  The solution you list above will attach the same image to all nodes in the tree.  I'm creating my tree dynamically, and it's heirarchical: the first level is a category (non-draggable), and the subordinate level is the nodes corresponding to that category (draggable).  So, I don't want an image on the non-draggable nodes. 

    Is there a way to dynamically determine the template image that will be used, or to choose to *not* use an image for a node?

    Here's the declarative code:
    <telerik:RadTreeView ID="rtvWidgetMenu" runat="server" EnableDragAndDrop="True" BorderWidth="1px" 
      Width="98%" CausesValidation="False" PersistLoadOnDemandNodes="False" ShowLineImages="False" 
            <img src="Images/widget.png" /><%#DataBinder.Eval(Container, "Text") %> 
        <ExpandAnimation Type="None" /> 

    ... and the codebehind:
            ''' <summary>  
            ''' As widgets are added, update the attribute property with additional information  
            ''' </summary>  
            ''' <remarks>this event fires as each item is added to the widget menu</remarks>  
            Protected Sub cRadTreeViewControl_NodeDataBound(ByVal sender As ObjectByVal e As Telerik.Web.UI.RadTreeNodeEventArgs) Handles cRadTreeViewControl.NodeDataBound  
                Dim item As DashboardWidgetMenuItem = DirectCast(e.Node.DataItem, DashboardWidgetMenuItem)  
                '*** add appropriate attributes to draggable items  
                '*** TODO: set up CSS class for images; tie images to database  
                If CType(e.Node.DataItem, DashboardWidgetMenuItem).ParentId IsNot Nothing Then 
                    e.Node.AllowDrag = True 
                    e.Node.AllowDrop = True 
                    ' e.Node.ImageUrl = "~\images\widget.png"  
                    ' e.Node.HoveredImageUrl = "~\images\widget.jpg"  
                    e.Node.Attributes.Add("ControlPath", item.ViewControlPath)  
                    e.Node.Attributes.Add("TitleText", item.Description)  
                    e.Node.Attributes.Add("ViewId", item.ViewId.ToString())  
                    e.Node.Attributes.Add("WidgetId", item.WidgetId.ToString())  
                    e.Node.AllowDrag = False 
                End If 
            End Sub 

    Thank you!

  5. Nikolay Tsenkov
    Nikolay Tsenkov avatar
    734 posts

    Posted 04 May 2010 Link to this post

    Hi Patrick Wirtz,

    A solution to your problem would be to create your own template and to add it from the code-behind to the dynamically created nodes.
    Here is a reference that should help you creating the server-side template class:

    Also, thank you for indicating that problem - we found a bug related to it (when image is assigned through ImageUrl of the RadTreeNode it's not displayed during Drag, but if it's added through NodeTemplate it shows up). The bug is being logged and will be fixed ASAP!
    For now you can solve your problem (as spoken above) with dynamically added (server-side) templates.

    Hope this is helpful!

    Nikolay Tsenkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top