We have requirements for 508 and WCAG within our system. I have been testing the ability to move between the controls using the keyboard and ran across a problem with the radtoolbar so am looking for a way to get it working.
In the example below i can use the keyboard and tab through the open, save, cancel options on the main tool bar. When i stop on the "open tab" option i use the down arrow key to open up the radmenu. i can use the up/down arrow to move up down through the menu without any issues.
the problem comes in when i need to expand the "level 1a" menu. when focus is on that item, i hit the right arrow to expand the menu out. however, what happens when i click the right arrow key is that the focus moves to the "save" menu option on the toolbar. so i can't open that lower level menu and continue using the keyboard to get into the level 2a-e menu options.
Is this a bug in the controls? Is there a way to workaround the issue so i can use the keyboard to access the level 2 menu items?
<telerik:RadToolBar ID="RadToolBar1" runat="server">
<Items>
<telerik:RadToolBarButton>
<ItemTemplate>
<telerik:RadMenu runat="server">
<Items>
<telerik:RadMenuItem Text="open tab">
<Items>
<telerik:RadMenuItem Text="level 1a">
<Items>
<telerik:RadMenuItem Text="level 2a"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2b"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2c"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2d"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2e"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1b"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1c"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1d"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
</Items>
</telerik:RadMenu>
</ItemTemplate>
</telerik:RadToolBarButton>
<telerik:RadToolBarButton Text="save"></telerik:RadToolBarButton>
<telerik:RadToolBarButton Text="cancel"></telerik:RadToolBarButton>
</Items>
</telerik:RadToolBar>
In the example below i can use the keyboard and tab through the open, save, cancel options on the main tool bar. When i stop on the "open tab" option i use the down arrow key to open up the radmenu. i can use the up/down arrow to move up down through the menu without any issues.
the problem comes in when i need to expand the "level 1a" menu. when focus is on that item, i hit the right arrow to expand the menu out. however, what happens when i click the right arrow key is that the focus moves to the "save" menu option on the toolbar. so i can't open that lower level menu and continue using the keyboard to get into the level 2a-e menu options.
Is this a bug in the controls? Is there a way to workaround the issue so i can use the keyboard to access the level 2 menu items?
<telerik:RadToolBar ID="RadToolBar1" runat="server">
<Items>
<telerik:RadToolBarButton>
<ItemTemplate>
<telerik:RadMenu runat="server">
<Items>
<telerik:RadMenuItem Text="open tab">
<Items>
<telerik:RadMenuItem Text="level 1a">
<Items>
<telerik:RadMenuItem Text="level 2a"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2b"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2c"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2d"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 2e"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1b"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1c"></telerik:RadMenuItem>
<telerik:RadMenuItem Text="level 1d"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
</Items>
</telerik:RadMenu>
</ItemTemplate>
</telerik:RadToolBarButton>
<telerik:RadToolBarButton Text="save"></telerik:RadToolBarButton>
<telerik:RadToolBarButton Text="cancel"></telerik:RadToolBarButton>
</Items>
</telerik:RadToolBar>