open a radcontextmenu on left click of a radbutton

4 posts, 0 answers
  1. Sigma
    Sigma avatar
    87 posts
    Member since:
    Apr 2012

    Posted 19 Oct 2012 Link to this post

    hii,
    How can i open a radcontextmenu on left click of a radbutton?


    thanks...
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Oct 2012 Link to this post

    Hi Sigma,

    Try the following code snippet to achieve your scenario.

    ASPX:
    <telerik:RadButton ID="RadButton1" runat="server" Text="Show" OnClientClicked="OnClientClicked">
    </telerik:RadButton>
    <telerik:RadContextMenu ID="RadContextMenu1" runat="server"  >
         <Items>
              <telerik:RadMenuItem Text="RadMenuItem1">
              </telerik:RadMenuItem>
              <telerik:RadMenuItem Text="RadMenuItem2">
              </telerik:RadMenuItem>
              <telerik:RadMenuItem Text="RadMenuItem3">
              </telerik:RadMenuItem>
         </Items>
    </telerik:RadContextMenu>

    JS:
    <script type="text/javascript">
        function OnClientClicked(sender, args) {
            var contextMenu = $find("<%= RadContextMenu1.ClientID %>");
            contextMenu.show(args);
        }
    </script>

    Regards,
    Shinu.
  3. Sam Tran
    Sam Tran avatar
    84 posts
    Member since:
    Nov 2006

    Posted 09 Nov in reply to Shinu Link to this post

    I had to add this:

    <script type="text/javascript">
        function OnClientClicked(sender, args) {
            var contextMenu = $find("<%= RadContextMenu1.ClientID %>");
            contextMenu.show(args);
            $telerik.cancelRawEvent(event);
        }
    </script>

     

    I'm attaching to a div.  The above code shows the context menu...

    How do I hide the menu when user clicks elsewhere or when user blurs off the context menu?

  4. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3916 posts

    Posted 10 Nov Link to this post

    Hi Sam,

    You can call the client-side hide() method of the RadContextMenu when you want it to hide: https://docs.telerik.com/devtools/aspnet-ajax/controls/menu/client-side-programming/objects/radmenu-and-radcontextmenu-objects#radcontextmenu-specific-api.

    To this end you can attach event handlers to the page (e.g., click for the body, mouseover for the body) and check whether the event originates from the menu, in a fashion similar to this thread: https://www.telerik.com/forums/how-to-show-hide-menu-on-mouseover-and-mouseout.

    Regards,

    Marin Bratanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top