Basically, I would like to be able to set a default state for the menu (which menu is open and which menu item has focus) in code behind (like the Page Load event).

The menu would start off showing the designated menu as open and the designated menu item would have focus but the user would still be able to hover over other menus to open them (the default open menu would then collapse).

If the user ends up moving the mouse off the menu without clicking anything, the menu would then automatically revert to the default state set in Page Load.

Currently, the only way to implement this functionality is to use hidden fields to store the open menu/focused menu item info (on Page Load) and then capture a bunch of JavaScript client events to setup the default menu state, collapse the menu when a different menu is hovered over and reset the menu to the default state when the mouse moves away without clicking.

It works but it's a lot of client code and occasionally the JavaScript events don't fire correctly (or in the correct sequence) and the menu won't reset properly or maybe the sub menus will overdraw each other.

It's a lot of work for something that I think should be built into the core RadMenu control. I'm also concerned about using so much JavaScript because I've been developing web apps for 15 years (using Telerik for 10 years) and every few years all my JavaScript code breaks (due to browser changes) and has to be rewritten. I'd much rather just set the relevant properties in code behind and let you guys worry about updating the client code.

It would be great to just set the default state in code behind and have the menu reset to that state when it loses focus. You could also have a reset timeout so that the menu will reset after the mouse is off the menu for a set number of seconds.

A quick Google search shows that people have been asking for an easy way to implement this for years.

The boundary detection is not applied to the ContentTemplate of a ContextMenu item:

<telerik:RadContextMenu runat="server" ID="RadContextMenu1" EnableScreenBoundaryDetection="true"  >
	<Items>
		<telerik:RadMenuItem Text="Item 1" Value="1">
		</telerik:RadMenuItem>
		<telerik:RadMenuItem Text="Item 2" Value="2" >
			<GroupSettings Width="400px" />
			<ContentTemplate>
				<div style="width: 400px;">
				some content here
				</div>
			</ContentTemplate>
		</telerik:RadMenuItem>
	</Items>
</telerik:RadContextMenu>

Currently the Menu with RenderMode="Mobile" expands only in one direction(down) and disregarding the value of the  DefaultGroupSettings-ExpandDirection property. 

This can be achieved if the role=menubar is set to the <ul> element containing the <li> menu items instead of the wrapper <div> element.

In this example from the WAI-ARIA Practices site, JAWS announces "1 of 3", "2 of 3", and "3 of 3" as the top-level menus are navigated.

https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html

 Workaround from Admin:

<script>
    function OnClientLoad(sender, args) {
        $telerik.$(sender.get_element()).removeAttr("role").find(">").attr("role", "menubar")
    }
</script>
<telerik:RadMenu runat="server" ID="RadMenu1" EnableAriaSupport="true"  RenderMode="Lightweight" OnClientLoad="OnClientLoad" TabIndex="1">

Hi,

I use the RadContextMenu control (ajax).  When I right-click a control to show the menu, the OnClientShowing or On ClientItemClicked events are fired.

Within this, I can get the html element that has been clicked, but what I really need is a reference to the actual control that was clicked.  For example, I have a checkbox on my page and the user can right-click the text on the checkbox, OR the check-box itself.  This makes it really tough to determine what the actual control was that was clicked (in this case, the RadCheckBox).

I thought it would be a cool idea to be able to get this control as part of the args for the event.

Tom.

RadContextMenu does not appear when there are more than one forms on the page and one of them is hidden. 

Steps to reproduce:

1. Right click on the table in RadEditor
2. The menu will not pop up.

<!DOCTYPE html>
<%@ Register Namespace="Telerik.Web.UI.Debug" TagPrefix="debug" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>

<body>
    <form id="searchform" style="display:none">aaa</form>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server" />

        <telerik:RadEditor ID="radEditor1" runat="server">
            <Content>
                <table>
                    <tbody>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                    </tbody>
                </table>
                <br />
            </Content>
        </telerik:RadEditor>

    </form>
</body>
</html>

RadMenu renders unneeded scroll button to its nested items in high DPI monitor. The problem can be reproduced with in 4K monitor (the zoom level does not matter).

Steps to reproduce:
1. Open https://demos.telerik.com/aspnet-ajax/menu/examples/overview/defaultcs.aspx?page=tables in high DPI monitor (4K)
2. Hover the Products item

Result: A scroll button is shown over the last item

Video:
https://www.screencast.com/t/lyemH3IjT 

JavaScript error "unable to get property 'handleEvent' of undefined or null reference" from Telerik.Web.Ui.WebResource.axd is thrown.

the scroll arrows do not have a proper z-index and get hidden when an item that is half-shown behind them is hovered, because this item gets a higher z-index.

attached is a video of the problem

WORKAROUND:
- set z-index to the arrows:

        .RadMenu .rmBottomArrow,
        .RadMenu .rmTopArrow {
            z-index: 31 !important;
        }

Go to http://demos.telerik.com/aspnet-ajax/menu/examples/functionality/rendermodes/defaultcs.aspx?Skin=Glow

Switch to RenderMode="Classic" and select some menu item. It will become gray colorized instead of yellow. The gradient should be removed.

Workaround:
Put the following style on the page with the menu control:
    <style>
        .rmLink.rmSelected { background-color: #db9810 !important; }
    </style>

Workaround:

function OnClientItemClicking(sender, eventArgs) {
	if ($telerik.isTouchDevice) {
		if (eventArgs.get_item().get_postBack()) {
			$telerik.$('.rmRootToggle').trigger('touchend');
		}
	}
}