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

RadTreeView with Context Menu

10 Answers 410 Views

TreeView

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

Srinivas Nilagiri asked on 02 Jul 2010, 07:54 AM

Hi,
I have RadTreeView with context menu. The code looks like this.

    
            <telerik:RadTreeView ID="RadTreeView1" runat="server" Style="border: 1px solid #CBE7F5;" 
        
                             OnNodeExpand="RadTreeView1_NodeExpand"  
        
                             OnNodeClick="RadTreeView1_NodeClick"  
        
                             OnClientNodeClicking="OnClientNodeClicking"   
        
                             OnContextMenuItemClick="RadTreeView1_ContextMenuItemClick" 
        
                             OnClientContextMenuItemClicking="onClientContextMenuItemClicking" 
        
                             OnClientContextMenuShowing="onClientContextMenuShowing" 
        
                             > 
        
                             <ContextMenus> 
        
                               <telerik:RadTreeViewContextMenu ID="MainContextMenu" runat="server"> 
        
                                    <Items> 
        
                                        <telerik:RadMenuItem Value="CR" Text="Create Change Request" ></telerik:RadMenuItem>                             
        
                                    </Items> 
        
                                    <CollapseAnimation Type="none" /> 
        
                                </telerik:RadTreeViewContextMenu> 
        
                             </ContextMenus>                  
        
                    </telerik:RadTreeView>

in the contextmenuitemclick event I am accessing the node like this

    
             protected void RadTreeView1_ContextMenuItemClick(object sender, RadTreeViewContextMenuEventArgs e) 
        
                { 
        
                    RadTreeNode clickedNode = e.Node; 
        
            }

most of the times the returns a valid RadTreeNode, but after a few clicks or the page is left untouched for a while the e.Node returns null. I suspected Session timeout but it is not. Any ideas on how to resolve this or am I doing some thing wrong? please help.

10 Answers, 1 is accepted

answered on 02 Jul 2010, 01:48 PM

Hi Srinivas Nilagiri,

This is the right way to access the tree Node - via e.Node in the ContextMenuItemClick handler. However I was not able to reproduce your case. In the ticket info I see the version is 2010.1 519. Is this true?

Also in your code I see you are subscribing to OnClientContextMenuItemClicking event. Could you please send me the full code you are using so we can inspect it and help you?

All the best,
Veronica Milcheva
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

answered on 26 Jan 2011, 06:51 PM

I am also having this issue and there seems to be no explanation for it and no way to try and reproduce it. I'm using 2010.3 and in my case I also subscribe to OnClientContextMenuItemClicking event, but it seems irrelevant in my case since it is just a switch statement and the menu item that it happens with (the most commonly used one mind you) doesn't do anything there.

Like the original poster said it works most of the time but sometimes randomly e.Node in the ContextMenuItemClick event is null.

Here's a snippet of the treeview which yes is embedded in a lot of controls:

<telerik:RadPageView ID="pvSteps" runat="server" Height="100%">

<telerik:RadSplitter ID="stepSplitter" runat="server" Width="100%" Height="100%" Skin="Windows7" BorderSize="0" BorderStyle="None"

SplitBarsSize="8px">

<telerik:RadPane ID="treePane" runat="server" Width="25%" BorderStyle="None">

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">

</telerik:RadAjaxLoadingPanel>

<table cellpadding="0" cellspacing="0" style="empty-cells: show; height: 100%; width: 100%">

<tr>

<td style="background-color: #fff; vertical-align: top">

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" Height="100%">

<telerik:RadTreeView ID="RadTreeView1" runat="server" AllowNodeEditing="true" OnNodeDrop="RadTreeView1_HandleDrop" EnableDragAndDrop="true"

EnableDragAndDropBetweenNodes="true" Skin="Simple" Height="100%" OnContextMenuItemClick="RadTreeView1_ContextMenuItemClick"

OnNodeEdit="RadTreeView1_NodeEdit" OnClientLoad="RadTreeView1_Load" OnClientContextMenuShowing="onClientContextMenuShowing"

OnClientContextMenuItemClicking="onClientContextMenuItemClicking" BackColor="Transparent" CssClass="stepTree" EnableEmbeddedSkins="True">

<ContextMenus>

<telerik:RadTreeViewContextMenu ID="rootContextMenu" runat="server">

<Items>

<telerik:RadMenuItem Text="New Step" Value="NewStep">

</telerik:RadMenuItem>

</Items>

</telerik:RadTreeViewContextMenu>

<telerik:RadTreeViewContextMenu ID="stepContextMenu" runat="server">

<Items>

<telerik:RadMenuItem Text="New Sub-Step" Value="NewSubStep">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Delete" Value="Delete">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Edit" Value="Edit">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Change Step Type" Value="ChangeType">

</telerik:RadMenuItem>

</Items>

</telerik:RadTreeViewContextMenu>

<telerik:RadTreeViewContextMenu ID="textContextMenu" runat="server">

<Items>

<telerik:RadMenuItem Text="New Sub-Step" Value="NewSubStep">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Change to Step" Value="ChangeType">

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Delete" Value="Delete">

</telerik:RadMenuItem>

</Items>

</telerik:RadTreeViewContextMenu>

</ContextMenus>

</telerik:RadTreeView>

</telerik:RadAjaxPanel>

</td>

</tr>

</table>

</telerik:RadPane>

<telerik:RadSplitBar ID="splitBar" runat="server" CollapseMode="Forward" CssClass="splitBar" Width="12px">

</telerik:RadSplitBar>

<telerik:RadPane ID="contentPane" runat="server">

</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPageView>

Here is relevent parts of the JS:

function onClientContextMenuItemClicking(sender, args) {

var menuItem = args.get_menuItem();

var treeNode = args.get_node();

var nodeAttributes = treeNode.get_attributes();

menuItem.get_menu().hide();

switch (menuItem.get_value()) {

case "Edit":

// Can't post, proprietary code

case "NewStep":

break;

case "NewSubStep":

break;

case "Delete":

var result = confirm("Are you sure you want to delete the item: " + treeNode.get_text());

args.set_cancel(!result);

break;

case "ChangeType":

var result2 = confirm("Changing the step type will completely discard the step's current values, are you sure you want to proceed?");

args.set_cancel(!result2);

}

And code-behind:

protected void RadTreeView1_ContextMenuItemClick(object sender, RadTreeViewContextMenuEventArgs e)

{

string nodeValue = "";

RadTreeNode clickedNode = e.Node;

switch (e.MenuItem.Value)

{

case "Delete":

RemoveStep(clickedNode.Attributes["guid"]);

clickedNode.Remove();

break;

case "ChangeType":

RemoveStep(clickedNode.Attributes["guid"]);

clickedNode.Attributes["nodeType"] = "Undefined";

break;

case "NewStep":

case "NewSubStep":

// Null reference occurs here because clickedNode somehow became null

nodeValue = clickedNode.Value + "_" + (clickedNode.Nodes.Count + 1).ToString();

RadTreeNode newSubStep = CreateNewNode("Enter step name", nodeValue, stepContextMenu.ID, "N", "Undefined");

clickedNode.Nodes.Add(newSubStep);

clickedNode.Expanded = true;

clickedNode.Attributes["nodeType"] = "TextNode";

//startNodeInEditMode(newSubStep.Value);

break;

}

SetNodeValues();

RadTreeView1.DataBind();

}

Any ideas? Need more info? This is running on IIS7 on Windows 7 Pro with .Net 4.0.

answered on 23 Jun 2011, 11:59 AM

Hi Gabriele,

Thank you for the attached project.

Unfortunately I tried to reproduce the issue but to no avail.

However I've noticed that you are using ServerSideCallBack for expand mode. You cannot create context menus in NodeExpand event handler. When this event is fired you could only update the content of the node which fired it. The reason for this is that the treeview makes an asynchronous request to the server.

In order to add context menus, you should use ServerSide expand mode and RadAjaxManager. This way when making an ajax request you could update the content of the node and add a context menu.
For more information you could check here.

Hope this helps.

Kind regards,
Veronica Milcheva
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.