How to display context menu?

  1. #1

    How to display context menu?

    I have the following code which works well to right click and select a treenode and call an Ajaxmethod. But in the AjaxMethod, I want to be able to dynamically make certain menuitems visible or not visible, based on passed in node id. I can't figure out how to make the menu visible AFTER I have set each menuitem visible or not visible. Do I have to inject some JavaScript from the AjaxMethod? Any help would be appreciated.

        <ext:Menu ID="mnuTreeView" runat="server">
            <Items>
                <ext:MenuItem ID="mnuRefresh" runat="server" Text="Refresh" Icon="ArrowRefresh">
                </ext:MenuItem>
                <ext:MenuSeparator></ext:MenuSeparator>
                <ext:MenuItem ID="mnuDelete" runat="server" Text="Delete" Icon="Delete">
                </ext:MenuItem>
            </Items>
        </ext:Menu>
        <ext:ViewPort ID="ViewPort1" runat="server">
            <Body>
                <ext:FitLayout ID="FitLayout1" runat="server">
                    <ext:TreePanel ID="tvwProjectFolders" runat="server" Title="" AutoScroll="true" Animate="false" Border="false" TrackMouseOver="false">
                    <Listeners>
                        <BeforeLoad Fn="nodeLoad" />
                        <ContextMenu Handler="this.getSelectionModel().select(node);Coolite.AjaxMethods.ShowMenu(node.id);" />
                    </Listeners>
                </ext:TreePanel>
                </ext:FitLayout>
            </Body>
        </ext:ViewPort>
  2. #2

    RE: How to display context menu?

    Hi,

    Here is an examples which show how to work with context menu


    Panel context menu - https://examples1.ext.net/#/Toolbar/Menu/Context_Menu/


    DataView context menu - http://forums.ext.net/showthread.php...8544-16-1.aspx

    TreePanel context menu - http://forums.ext.net/showthread.php...6418-16-1.aspx


  3. #3

    RE: How to display context menu?

    These examples don't work for me because they are showing static menus, that don't change. I need to be able to dynamically change the visibility of menu items based on passed in node id to AjaxMethod. Is this possible??
  4. #4

    RE: How to display context menu?

    Hi,

    Please see the following sample
    
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        
        <style type="text/css">
            .node-label
            {
                font-weight:bold;
                font-size:12px;
                padding:5px 0px 5px 28px;            
                width:150px;
            }
        </style>
        
        <script runat="server">
            [AjaxMethod]
            public void ShowMenu(int x, int y)
            {
                ScriptManager1.AddScript("{0}.hide();", MenuItem1.ClientID);
                ScriptManager1.AddScript("{0}.showAt([{1}, {2}]);", BrowseMenu.ClientID, x, y);
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
            <ext:TreePanel ID="Browse" runat="server" Border="false" Stateful="true">
                <Root>
                    <ext:TreeNode Text="Home" Leaf="false" Icon="House">
                        <Nodes>
                            <ext:TreeNode Text="Folder 1" Icon="Folder">
                                <Nodes>
                                    <ext:TreeNode Text="File 1" Icon="Folder" />
                                </Nodes>
                            </ext:TreeNode>
                            <ext:TreeNode Text="Folder 2" Icon="Folder">
                                <Nodes>
                                    <ext:TreeNode Text="File 2" Icon="Share" />
                                </Nodes>
                            </ext:TreeNode>
                        </Nodes>
                    </ext:TreeNode>
                </Root>
                <Listeners>
                    <ContextMenu Handler="#{BrowseMenu}.node = node;Coolite.AjaxMethods.ShowMenu(e.getXY()[0], e.getXY()[1]);" />
                </Listeners>
            </ext:TreePanel>
            
            <ext:Menu ID="BrowseMenu" runat="server">
                <Items>
                    <ext:TextMenuItem ID="NodeLabel" runat="server" CtCls="node-label"  />
                    <ext:MenuItem runat="server" Text="Create New" >
                        <Listeners>
                            <Click Handler="Ext.Msg.alert(this.parentMenu.node.text, 'Create sub items');" />
                        </Listeners>
                    </ext:MenuItem>
                    
                    <ext:MenuItem ID="MenuItem1" runat="server" Text="Item1" >
                    </ext:MenuItem>
                    <ext:MenuItem ID="MenuItem2" runat="server" Text="Item2" >
                    </ext:MenuItem>
                </Items>
                <Listeners>
                    <BeforeShow Handler="#{NodeLabel}.el.update(this.node.text);" />
                </Listeners>
            </ext:Menu>
        </form>
    </body>
    </html>
    Unfortunatelly it is need use ScriptManager AddScript for correct script sequence
  5. #5

    RE: How to display context menu?

    Perfect! Works great.

Similar Threads

  1. Replies: 0
    Last Post: Mar 29, 2012, 12:50 PM
  2. GridPanel - Context Menu
    By Tbaseflug in forum 1.x Help
    Replies: 8
    Last Post: Sep 28, 2011, 4:01 PM
  3. Context menu in Gridview row
    By gayancc in forum 1.x Help
    Replies: 3
    Last Post: Nov 19, 2010, 5:32 PM
  4. Context Menu in desktop
    By dotnet in forum 1.x Help
    Replies: 7
    Last Post: Sep 16, 2010, 4:30 PM
  5. [CLOSED] context menu
    By speedstepmem3 in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Apr 07, 2009, 6:06 AM

Posting Permissions