RadContextMenuItem.click() does not do a postback

5 posts, 1 answers
  1. David
    David avatar
    38 posts
    Member since:
    Oct 2007

    Posted 25 Feb 2009 Link to this post

    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:

    1                 var menu = selectedNode.get_contextMenu(); 
    2                 var item = menu.get_focusedItem(); 
    3                 if (item) { 
    4                     alert("clicking '" + item.get_text() + "'"); 
    5                     item.click(); 
    6                 } 
    7  

    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?
  2. Yana
    Admin
    Yana avatar
    5013 posts

    Posted 26 Feb 2009 Link to this post

    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.
  3. David
    David avatar
    38 posts
    Member since:
    Oct 2007

    Posted 26 Feb 2009 Link to this post

    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.

    1 <body onkeydown="HandleKey(event)"
    2     <form id="form1" runat="server"
    3     <div> 
    4         <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
    5         </telerik:RadScriptManager> 
    6         <telerik:RadTreeView ID="RadTreeView1" runat="server" OnContextMenuItemClick="RadTreeView1_ContextMenuItemClick"
    7             <ContextMenus> 
    8                 <telerik:RadTreeViewContextMenu ID="contextMenu1" runat="server"
    9                     <Items> 
    10                         <telerik:RadMenuItem Text="item 1" /> 
    11                     </Items> 
    12                 </telerik:RadTreeViewContextMenu> 
    13             </ContextMenus> 
    14             <Nodes> 
    15                 <telerik:RadTreeNode Text="node 1" /> 
    16                 <telerik:RadTreeNode Text="node 2" /> 
    17             </Nodes> 
    18         </telerik:RadTreeView> 
    19     </div> 
    20     <br /> 
    21     <input id="Button1" type="button" value="click" onclick="javascript:clickContextMenuItem()" /> 
    22     <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
    23     </form> 
    24  
    25     <script type="text/javascript"
    26         function clickContextMenuItem() { 
    27             var tree = $find("<%=RadTreeView1.ClientID %>"); 
    28             var selectedNode = tree.get_selectedNode(); 
    29             var menu = selectedNode.get_contextMenu(); 
    30             var item = menu.get_items().getItem(0); 
    31             if (item) { 
    32                 alert("clicking '" + item.get_text() + "'"); 
    33                 item.click(); 
    34             } 
    35         } 
    36  
    37         function HandleKey(e) { 
    38             var keynum = null
    39             if (e.keyCode) { 
    40                 keynum = e.keyCode; 
    41             } 
    42             else if (e.which) { 
    43                 keynum = e.which; 
    44             } 
    45             else { 
    46                 alert("what kind of browser are you using!?"); 
    47             } 
    48  
    49             if (keynum != null) { 
    50                 if (keynum == 16) // shift key opens the menu 
    51                 { 
    52                     var tree = $find("<%= RadTreeView1.ClientID %>"); 
    53                     if (tree.get_selectedNode()) 
    54                         ShowMenu(); 
    55                 } 
    56                 else if (keynum == 13) // enter key clicks the focused context menu item 
    57                 { 
    58                     clickContextMenuItem(); 
    59                 } 
    60             } 
    61         } 
    62  
    63         function ShowMenu() { 
    64             var theTree = $find("<%= RadTreeView1.ClientID %>"); 
    65             var menu = theTree.get_nodes().getNode(0).get_contextMenu(); 
    66             menu.showAt(200, 75); 
    67             var item = menu.get_items().getItem(0); 
    68             item.focus(); 
    69         } 
    70     </script> 
    71  
    72 </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
  4. Answer
    Yana
    Admin
    Yana avatar
    5013 posts

    Posted 27 Feb 2009 Link to this post

    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.
  5. David
    David avatar
    38 posts
    Member since:
    Oct 2007

    Posted 27 Feb 2009 Link to this post

    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.
Back to Top