Rad Context menu is not working

2 posts, 0 answers
  1. Gobi
    Gobi avatar
    2 posts
    Member since:
    Aug 2012

    Posted 20 Oct 2013 Link to this post

    Hi All,

    I am using .Net 4.0 [Visual Studio 2010], Telerik version 2013.

    I am facing an issue with the Rad Context menu, when I try to call the RadContextMenu using the "onmouseup" event it is not working. Actually the menu is coming and disappearing immediately. But the same code is working for "onclick" and other events.

    Is there any issue with RadContextMenu in 2103 Telerik version. Please help me to resolve. 

    Below the code which I used to call the menu,

    <form id="form1" runat="server">
         <asp:ScriptManager runat="server" ID="asps"></asp:ScriptManager>
        <div onmouseup="showMenu(event)" runat="server" onmouseup="return false" id="div1">
        <asp:Literal ID="literal1" runat="server">
        This is sample text to test the Rad context menu
        </asp:Literal>
         <telerik:RadContextMenu ID="RadContextMenu1" runat="server"
                        EnableRoundedCorners="true" EnableShadows="true">
                        <Items>
                             <telerik:RadMenuItem Text="Trees" />
                             <telerik:RadMenuItem Text="Sunset" />
                             <telerik:RadMenuItem Text="Mountains" />
                        </Items>
                   </telerik:RadContextMenu>
        </div>
        <telerik:RadScriptBlock runat="server">
              <script type="text/javascript">
              function showMenu(e) {
                   var contextMenu = $find("<%= RadContextMenu1.ClientID %>");
     
                   $telerik.cancelRawEvent(e);
     
                   if ((!e.relatedTarget) || (!$telerik.isDescendantOrSelf(contextMenu.get_element(), e.relatedTarget))) {
                        contextMenu.show(e);
                   }
              }
          </script>
         </telerik:RadScriptBlock>
        </form>


    Thanks in advance.
  2. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1266 posts

    Posted 23 Oct 2013 Link to this post

    Hi Gobi,

    In order to show the context menu upon mouseup event, the code should be executed in a setTimeout statement as shown below:
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
               <div onmouseup="showMenu(event)" runat="server" id="div1">
                   <asp:Literal ID="literal1" runat="server">
                       This is sample text to test the Rad context menu
                   </asp:Literal>
                   <telerik:RadContextMenu ID="RadContextMenu1" runat="server"
                       EnableRoundedCorners="true" EnableShadows="true">
                       <Items>
                           <telerik:RadMenuItem Text="Trees" />
                           <telerik:RadMenuItem Text="Sunset" />
                           <telerik:RadMenuItem Text="Mountains" />
                       </Items>
                   </telerik:RadContextMenu>
               </div>
               <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
                   <script type="text/javascript">
                       function showMenu(e) {
                           var contextMenu = $find("<%= RadContextMenu1.ClientID %>");
                           setTimeout(function () {
     
                               $telerik.cancelRawEvent(e);
     
                               if ((!e.relatedTarget) || (!$telerik.isDescendantOrSelf(contextMenu.get_element(), e.relatedTarget))) {
                                   contextMenu.show(e);
                               }
                           }, 0);
                       }
                   </script>
               </telerik:RadScriptBlock>


    Regards,
    Dimitar Terziev
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top