Keyboard Navigation

The entire Toolbar commands can be accessed through the keyboard by specifying the Keyboard Shortcut listed in the following table.

List of keyboard shortcuts

Keyboard Shortcut Function
Alt + j Focuses the control
UP Navigates up and left.
Down Navigates down and right.
Left Navigates up and left.
Right Navigates down and right.
Home Navigates to the starting item.
End Navigates to the ending item.
Enter Selects the focused item

The following code example illustrates shortcuts associated with the Toolbar items.

  • cshtml
  • // Add this code in your CSHTML page and refer local data section for data source
    
    <ej-toolbar id="toolbar" width="250px" dataSource="ViewBag.datasource">
        <e-toolbar-fields id="iconid" sprite-css-class="spriteCss">
    </ej-toolbar>
    
    <script>
        $(function () {
            //Control focus key
            $(document).on("keydown", function (e) {
                if (e.altKey && e.keyCode === 74) {
                    // j- key code.
                    $("#toolbar").focus();
                }
            });
        });
    </script>

    ToolBar control with Keyboard shortcuts