# Keyboard Support

## Keyboard support

As a part of Q2 2013 **RadDropDownTree** control introduces fully built-in **Keyboard Support**. If you set a **TabIndex** to it, you can also focus it like a simple form input through the **Tab** key along with other inputs on the page.

The following list explains the specific behaviors and keyboard shortcuts you can use to navigate through the dropdown tree.

* **Access Key** - You can specify a key that moves the focus directly to the RadDropDownTree element. The access key is defined using the **AccessKey** property. For example, if you set the **AccessKey** property to **P**, the focus moves to the DropDownTree when the user presses **"Alt+P"** (for IE). While the focus is on this element, you can use **Tab** or **Shift** + **Tab** to move between all form elements.

  ![dropdowntree-keyboardnavigation](https://www.telerik.com/products/aspnet-ajax/documentation/assets/a21668b629119421cd8064ef944f65ff/dropdowntree-keyboardnavigation.png)

* **Key Navigation** - RadDropDownTree allows end-users to navigate through the nodes in the dropdown.

  1. When the main element of the drpodown tree is focused, use **Alt** + **Down Arrow** to open the dropdown.

     ![dropdowntree-expandcollapsedropdown](https://www.telerik.com/products/aspnet-ajax/documentation/assets/a9b6f62d36e4797f2f14862d6993ed60/dropdowntree-expandcollapsedropdown.png)

  2. Once the dropdown is opened you can move the focus to the filter field and then to the nodes by using the **Down Arrow** key.

     ![dropdowntree-forwardnavigation](https://www.telerik.com/products/aspnet-ajax/documentation/assets/14acd2e0ae1b72cd1df48657de8018c2/dropdowntree-gotodropdown.png)

     > tip Once focus is on the treeview, to reach the filter textbox again, press the **AccessKey** and then **Down Arrow** once more. Alternatively, close the dropdown through **Esc** and open it again through **Alt** + **Down Arrow**, and press **Down Arrow**.

  3. After the focus is set to the tree, use the **Up Arrow** and **Down Arrow** to navigate up and down the tree and the **Right Arrow** and **Left Arrow** to expand and collapse the nodes. Using **Alt** + **+**/**-** also expands/collapses an item.

     ![dropdowntree-navigationupdown](https://www.telerik.com/products/aspnet-ajax/documentation/assets/844d164c2827b12a5b29300f9e3c21e8/dropdowntree-navigationupdown.png)

     ![dropdowntree-expandcollapsenode](https://www.telerik.com/products/aspnet-ajax/documentation/assets/d376e6add07cbc327e55c742db6cdfc3/dropdowntree-expandcollapsenode.png)

  4. When the focus is in the tree, start typing to get a "starts with" match for the nodes. The first node that matches the typed text will be focused. Once text no longer matches a node, the current node will remain focused.

  5. To close the dropdown,  press the **Esc** key. This will focus the main element so you can move out of the dropdown and through the rest of the form via **Tab** or **Shift** + **Tab**. You can also return to the main element by using its **Access Key**.

* **Action Key** -When the focus is set to a node, pressing the **Space** key checks the node without closing the dropdown. Pressing **Enter** selects the node and closes the dropdown.

  ![dropdowntree-ckecknodes](https://www.telerik.com/products/aspnet-ajax/documentation/assets/084da8cec9c7be4fb149ff5a105e5561/dropdowntree-ckecknodes.png)

> caption  Key combinations supported by different browsers

| Browser               | Focus                                                | Action Key | Navigation Forward | Navigation Backward |
| --------------------- | ---------------------------------------------------- | ---------- | ------------------ | ------------------- |
| **Internet Explorer** | Alt + **Access Key**                                 | Space      | Tab                | Shift + Tab         |
| **Firefox**           | Alt + Shift + **Access Key**                         | Space      | Tab                | Shift + Tab         |
| **Chrome**            | Not Supported                                        | Space      | Tab                | Shift + Tab         |
| **Safari**            | Alt + **Access Key** (Alt + Shift + **Access Key** ) | Space      | Tab                | Shift + Tab         |
| **Opera**             | Not Supported                                        | Space      | Tab                | Shift + Tab         |

## See Also

* [Live Demo - RadDropDownTree Keyboard Support](https://demos.telerik.com/aspnet-ajax/dropdowntree/examples/functionality/keyboard-support/defaultcs.aspx)
