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

RadContextMenuItem.click() does not do a postback

4 Answers 225 Views
Menu
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 25 Feb 2009, 07:51 PM
Hello,

I've been reading up on the documentation of the RadMenu and the RadContextMenu, and am having trouble with a client-side call to RadContextMenuItem.click() performing a regular postback as if the mouse had clicked it.  This is the code I have:

                var menu = selectedNode.get_contextMenu(); 
                var item = menu.get_focusedItem(); 
                if (item) { 
                    alert("clicking '" + item.get_text() + "'"); 
                    item.click(); 
                } 
 

I am particularly trying to get this to work with a TreeView.  When I activate the context menu and tell it to show(), I also have it set to automatically focus the first item in the context menu so the keyboard arrows will function to select the desired item.  Then I have code set so when the enter key is pressed, it executes the above sample code.  The only problem is that when it gets to item.click() it doesn't do a post back.  The contextmenu remains open as if nothing happened.  The alert appears, telling me which item it is clicking (I just inserted that to make sure it was finding all the objects ok) but nothing else happens.

I am using the Q2 2008 ASP.NET Ajax controls.  Am I doing something wrong?

4 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 26 Feb 2009, 01:24 PM
Hello David,

The context menu should be visible in order to fire the server-side event using
RadContextMenuItem.click(). I've attached a sample page which shows that it works without a problem. Select a node, open its context menu and click  the "click" button, you'll see that the sever event OnContextMenuItemClick is fired.

Kind regards,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
David
Top achievements
Rank 1
answered on 26 Feb 2009, 04:44 PM
Hi,

Thank you for your reply.  I see that doing it that way does cause a post back, but I see now that I didn't explain what I'm trying to do very well.  I've modified the code in the Default.aspx markup to show my intentions.  Notice the 'onkeydown' event in the <body> tag.  When a tree node is selected, pressing the shift key will open the context menu.  After that, pressing enter will click the focused context menu item.  This click does not do a post back.

<body onkeydown="HandleKey(event)"
    <form id="form1" runat="server"
    <div> 
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
        </telerik:RadScriptManager> 
        <telerik:RadTreeView ID="RadTreeView1" runat="server" OnContextMenuItemClick="RadTreeView1_ContextMenuItemClick"
            <ContextMenus> 
                <telerik:RadTreeViewContextMenu ID="contextMenu1" runat="server"
                    <Items> 
                        <telerik:RadMenuItem Text="item 1" /> 
                    </Items> 
                </telerik:RadTreeViewContextMenu> 
            </ContextMenus> 
            <Nodes> 
                <telerik:RadTreeNode Text="node 1" /> 
                <telerik:RadTreeNode Text="node 2" /> 
            </Nodes> 
        </telerik:RadTreeView> 
    </div> 
    <br /> 
    <input id="Button1" type="button" value="click" onclick="javascript:clickContextMenuItem()" /> 
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
    </form> 
 
    <script type="text/javascript"
        function clickContextMenuItem() { 
            var tree = $find("<%=RadTreeView1.ClientID %>"); 
            var selectedNode = tree.get_selectedNode(); 
            var menu = selectedNode.get_contextMenu(); 
            var item = menu.get_items().getItem(0); 
            if (item) { 
                alert("clicking '" + item.get_text() + "'"); 
                item.click(); 
            } 
        } 
 
        function HandleKey(e) { 
            var keynum = null
            if (e.keyCode) { 
                keynum = e.keyCode; 
            } 
            else if (e.which) { 
                keynum = e.which; 
            } 
            else { 
                alert("what kind of browser are you using!?"); 
            } 
 
            if (keynum != null) { 
                if (keynum == 16) // shift key opens the menu 
                { 
                    var tree = $find("<%= RadTreeView1.ClientID %>"); 
                    if (tree.get_selectedNode()) 
                        ShowMenu(); 
                } 
                else if (keynum == 13) // enter key clicks the focused context menu item 
                { 
                    clickContextMenuItem(); 
                } 
            } 
        } 
 
        function ShowMenu() { 
            var theTree = $find("<%= RadTreeView1.ClientID %>"); 
            var menu = theTree.get_nodes().getNode(0).get_contextMenu(); 
            menu.showAt(200, 75); 
            var item = menu.get_items().getItem(0); 
            item.focus(); 
        } 
    </script> 
 
</body> 

That is what I would like to do.  Obviously I guess ContextMenu.showAt(x, y) doesn't allow for a post back when the click() event is called on one of it's items?  Or the mere fact of right clicking the tree node with the mouse hooks up that particular node with the context menu item events?  That's probably it.  So, is there any way I can do what it is I'm trying to do?  I would like to be able to work with the selected tree node in codebehind after the ContextMenuItem.click() causes a post back to the ContextMenu's click event handler.

Thanks,
-David
0
Accepted
Yana
Telerik team
answered on 27 Feb 2009, 07:48 AM
Hello David,

Thank you for providing the code.

The server event is not fired because RadTreeView doesn't know for which node exactly is the open context menu. To fix this, you should add the following line in clickContextMenuItem() function:

function clickContextMenuItem() {    
 var tree = $find("<%=RadTreeView1.ClientID %>");    
 var selectedNode = tree.get_selectedNode();    
 var menu = selectedNode.get_contextMenu();   
 
 tree._contextMenuNode = selectedNode;  
 
 var item = menu.get_items().getItem(0);    
 if (item) {    
     alert("clicking '" + item.get_text() + "'");    
     item.click();    
 }    
}   


Greetings,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
David
Top achievements
Rank 1
answered on 27 Feb 2009, 09:46 PM
Thank you!  It works perfectly.  That's what I needed to know.

I would say that's information that should be included in the online help for RadTreeView with client-side programming located here:
http://www.telerik.com/help/aspnet-ajax/tree_clientradtreeviewobject.html

Reading the info on that page would leave one unaware of such a property.
Tags
Menu
Asked by
David
Top achievements
Rank 1
Answers by
Yana
Telerik team
David
Top achievements
Rank 1
Share this question
or