Submenu is closing automatically when mouse over to different parent menu item in radmenu even though click to open is set to Yes

2 posts, 0 answers
  1. Neil
    Neil avatar
    1 posts
    Member since:
    Mar 2020

    Posted 25 Mar Link to this post

    I am using RadMenu Control in my page. I have set Click to Open as "Yes". So Ideally the sub-menu should open and close only when I click on parent menu item. Below is the behavior that I got:

    1) When it loads the page and when I mouse over to parent menu item 1(My Profile). It does not open the sub-menu which behaves correct as I set Click to open "Yes"
    2) Now click on parent menu item 1(My Profile) and it will open sub menu(Profile and Sign Out). 
    3) Now when I mouse over to parent menu item 2(Messages), my sub menu(Profile and Sign Out) closes which should not happen as I set click to open as "Yes". so it should only open and close only when I click on parent menu item 1(My Profile) or close the sub-menu if I click outside of parent menu item 1(My Profile)
    4) Now when I mouse over back to parent menu item 1(My Profile), it opens the sub-menu again. It should only open when I click on parent menu item 1(My Profile).

    So basically, on step 3 it should keep the sub-menu open on mouse over to parent menu item 2(Messages). Just to know the sub-menu is closing only on mouse over to parent menu item 2(Messages). In my actual project I have some different components as well and it does not close the sub-menu on mouse over to those components.

    Required HTML:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <telerik:RadMenu ID="RadMenu1" runat="server" ClickToOpen="True">
                    <Items>
                        <telerik:RadMenuItem runat="server" Text="My Profile">
                            <Items>
                                <telerik:RadMenuItem runat="server" Text="Profile">
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem runat="server" Text="Sign Out">
                                </telerik:RadMenuItem>
                            </Items>
                        </telerik:RadMenuItem>
                        <telerik:RadMenuItem runat="server" Text="Messages">
                        </telerik:RadMenuItem>
                    </Items>
                </telerik:RadMenu>
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
            </div>
        </form>
    </body>
    </html>
  2. Peter Milchev
    Admin
    Peter Milchev avatar
    692 posts

    Posted 30 Mar Link to this post

    Hello Neil,

    I am sharing the answer from your duplicated support thread, for convenience and better visibility from the community:

    The ClickToOpen is applied only to the opening of the root items. As you can see in the article, then collapse works normally, meaning the menu is closed when the mouse hovers out of the menu. 

    Nevertheless, you can use the approach of the following KB article, which will not close the menu item when the mouse hovers another root item:

    Regards,
    Peter Milchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top