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

Altering Context Menu - Client Side

6 Answers 80 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Andy
Top achievements
Rank 1
Andy asked on 16 Jul 2014, 07:46 AM
Hi,

I’m trying to program the context menu (client side) to
display different  menus based upon the
node that is clicked on.

So far I have managed to get the system to work out which
node its on:
 

            
var NodeType = args._node.get_attributes().getAttribute("type1");
 
if (NodeType == "position") {
     
}
else if (NodeType == "serial") {
}

 

But I’m having no success is determining how to change the
context menu – Any suggestions (I’m very new to javascript)

6 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 16 Jul 2014, 12:41 PM
Hi Andy,

Try to attach the OnClientContextMenuShowing event of RadTreeView and show/hide the contextmenu item based on the selected node.

JavaScript:
function showMenu(sender, args) {
      var contextmenu = $find("<%=RadTreeVewContextMenu1.ClientID %>");
      if (args.get_node().get_text() == "position") {
          contextmenu.findItemByText("New").hide();
          contextmenu.findItemByText("Add").show()
          contextmenu.findItemByText("Delete").show();
          contextmenu.findItemByText("Update").show();
      }
      else {
          contextmenu.findItemByText("New").hide();
          contextmenu.findItemByText("Add").hide();
          contextmenu.findItemByText("Delete").hide();
          contextmenu.findItemByText("Update").show();
      }
  }

Thanks,
Shinu.
0
Andy
Top achievements
Rank 1
answered on 16 Jul 2014, 03:02 PM
Thanks for the suggestion.  I've tried it but when the page opens I get an error message:

The Controls collection cannot be modified because the control contains code
blocks (i.e. <% ... %>).

Any ideas?
0
Andy
Top achievements
Rank 1
answered on 16 Jul 2014, 03:17 PM
Got round this, but now get this error:

Error: Unable to get value of the property 'finditemByText': object is null or undefined
0
Shinu
Top achievements
Rank 2
answered on 17 Jul 2014, 02:49 AM
Hi Andy,

From your last post I have noticed you are using 'finditemByText'  method. The correct way of using this method is findItemByText. The 'I' should be in capital letter. Please do the modification in your code snippet and let me know if you have any concern.

Thanks,
Shinu.
0
Andy
Top achievements
Rank 1
answered on 17 Jul 2014, 07:01 AM

Hi Shinu,

Thanks for the reply.  I gave it a try but the same error still appears> Here is all the code in case I've overlooked something

<telerik:RadTreeView ID="RadTreeView1" runat="server" OnNodeClick="RadTreeView1_NodeClick"
    Visible="True" Skin="Default" OnClientContextMenuItemClicked="SetPlaceHolders" OnClientContextMenuShowing="showMenu">
    <ContextMenus>
        <telerik:RadTreeViewContextMenu ID="RadTreeViewContextMenu1" runat="server" ResolvedRenderMode="Classic">
            <Items>
                <telerik:RadMenuItem runat="server" Text="Delete">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Add">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Export">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadTreeViewContextMenu>
    </ContextMenus>
</telerik:RadTreeView>

and here is the javascript
function showMenu(sender, args) {
    var contextmenu = $find("<%=RadTreeViewContextMenu1.ClientID %>");
    var NodeType = args._node.get_attributes().getAttribute("type1");
    if (NodeType == "position") {
        contextmenu.findItemByText("Export").hide();
    }
    else {
        contextmenu.findItemByText("Export").show();
 
    }
}
0
Shinu
Top achievements
Rank 2
answered on 18 Jul 2014, 02:57 AM
Hi Andy,

Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code snippet which works fine at my end.

ASPX:
<telerik:RadTreeView ID="RadTreeView1" runat="server" OnClientContextMenuShowing="showMenu">
    <ContextMenus>
        <telerik:RadTreeViewContextMenu ID="RadTreeViewContextMenu1" runat="server" ResolvedRenderMode="Classic">
            <Items>
                <telerik:RadMenuItem runat="server" Text="Delete">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Add">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Export">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadTreeViewContextMenu>
    </ContextMenus>
    <Nodes>
        <telerik:RadTreeNode runat="server" Text="position" ContextMenuID="RadTreeViewContextMenu1">
        </telerik:RadTreeNode>
        <telerik:RadTreeNode runat="server" Text="serial" ContextMenuID="RadTreeViewContextMenu1">
        </telerik:RadTreeNode>
    </Nodes>
</telerik:RadTreeView>

JavaScript:
function showMenu(sender, args) {
    var contextmenu = $find("<%=RadTreeViewContextMenu1.ClientID %>");
    var NodeType = args._node.get_attributes().getAttribute("type1");
    if (NodeType == "position") {
        contextmenu.findItemByText("Export").hide();
    }
    else {
        contextmenu.findItemByText("Export").show();
    }
}

C#:
protected void Page_Load(object sender, EventArgs e)
{
    RadTreeNode node = (RadTreeNode)RadTreeView1.Nodes.FindNodeByText("position");
    node.Attributes["type1"] = "position";
    RadTreeNode node1 = (RadTreeNode)RadTreeView1.Nodes.FindNodeByText("serial");
    node1.Attributes["type1"] = "serial";
}

Thanks,
Shinu.
Tags
TreeView
Asked by
Andy
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Andy
Top achievements
Rank 1
Share this question
or