Tab (key) navigation inside a context menu

4 posts, 1 answers
  1. David
    David avatar
    4 posts
    Member since:
    Oct 2012

    Posted 27 Mar 2015 Link to this post

    Hi there,

    We are using RadContextMenu to pop up a small editor with several TextBoxes.  We would like our users to be able to navigate among the text boxes using the Tab key.  However, this doesn't work -- tab does nothing.

    The following is a trivial example of a ContextMenu with three text boxes.  Click inside one TextBox and hit tab.  I would expect it to cycle among the three tabs.

    How can we enable this behavior, please?

    Thanks!

    -David

    <Window x:Class="telerik_context_menu_taborder.MainWindow"
            Title="MainWindow" Height="350" Width="525">
        <Grid>
            <Rectangle Fill="Black" Width="100" Height="50">
                <telerik:RadContextMenu.ContextMenu>
                    <telerik:RadContextMenu KeyboardNavigation.TabNavigation="Cycle" >
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <TextBox Grid.Row="0" Text="TextBox1" />
                            <TextBox Grid.Row="1" Text="TextBox2" />
                            <TextBox Grid.Row="2" Text="TextBox3" />
                        </Grid>
                    </telerik:RadContextMenu>
                </telerik:RadContextMenu.ContextMenu>
            </Rectangle>
        </Grid>
    </Window>


  2. Answer
    Kalin
    Admin
    Kalin avatar
    1208 posts

    Posted 30 Mar 2015 Link to this post

    Hello David,

    What I can suggest you for this particular scenario would be to use RadMenuGroupItem instead in order to achieve the desired functionality:

    <Rectangle Fill="Black" Width="100" Height="50">
        <telerik:RadContextMenu.ContextMenu>
            <telerik:RadContextMenu KeyboardNavigation.TabNavigation="Cycle">
                <telerik:RadMenuGroupItem>
                    <Grid Margin="10">
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <TextBox Grid.Row="0" Text="TextBox1" />
                        <TextBox Grid.Row="1" Text="TextBox2" />
                        <TextBox Grid.Row="2" Text="TextBox3" />
                    </Grid>
                </telerik:RadMenuGroupItem>
            </telerik:RadContextMenu>
        </telerik:RadContextMenu.ContextMenu>
    </Rectangle>

    Hope this helps.

    Regards,
    Kalin
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  3. UI for WPF is Visual Studio 2017 Ready
  4. David
    David avatar
    4 posts
    Member since:
    Oct 2012

    Posted 30 Mar 2015 in reply to Kalin Link to this post

    Thank you!  That works!

    Can you comment on why it is the case that it would be necessary to enclose the content in a RadMenuGroupItem, please?  What does that add, change or override?
  5. Kalin
    Admin
    Kalin avatar
    1208 posts

    Posted 31 Mar 2015 Link to this post

    Hello David,

    RadMenuGroupItem should be used when you simply need to display any UIElements straight forward. Basically the ContextMenu should contain MenuItems and this is suitable for cases when don't want show a RadMenuItem but other UIElements instead. For more details about the different MenuItems check here.

    Hope this helps.

    Regards,
    Kalin
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top