Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Keyboard Support

Press CTRL + SHIFT + D to move focus to the ASPxTreeList control
  
Department
Location
Phone1
Phone2
CollapseCorporate HeadquartersMonterey(408) 555-1234(408) 555-1234
 CollapseSales and MarketingSan Francisco(415) 555-1234(415) 555-1234
   Field Office: CanadaToronto(416) 677-1000(416) 555-1234
   Field Office: East CoastBoston(617) 555-4234(415) 555-1234
  ExpandPacific Rim HeadquartersKuaui(808) 555-1234(808) 555-1234
   MarketingSan Francisco(415) 555-1234(415) 555-1234
  FinanceMonterey(408) 555-1234(408) 555-1234
 CollapseEngineeringMonterey(408) 555-1234(408) 555-1234
  ExpandConsumer Electronics Div.Burlington, VT(802) 555-1234(802) 555-1234
  ExpandSoftware Products Div.Monterey(408) 555-1234(408) 555-1234

The DevExpress ASP.NET Tree List (ASPxTreeList) includes keyboard support. Primary navigation operations (such as accessing the control within a form, moving focus through nodes, selecting and expanding/collapsing nodes, and paging) can be performed using a keyboard instead of a pointing device. In addition, enabling keyboard support in ASPxTreeList allows you to create web pages that conform to web accessibility guidelines.

To enable keyboard navigation, set the KeyboardSupport property of the ASPxTreeList to true. This activates the following features:

  • Access Key – The ASPxTreeList control can easily be accessed (focused) using a user-defined keyboard shortcut. This shortcut is composed of the preset CTRL+SHIFT combination and a single character string specified by the AccessKey property. For example, setting the access key of a TreeList control to the "D" string indicates that an end-user can navigate to the grid by pressing CTRL+SHIFT+D.
  • Focused Node – The Focused Node feature is automatically activated, regardless of the property setting (SettingsBehavior.AllowFocusedNode)of the corresponding feature. Focus can be moved between nodes by using the UP ARROW and DOWN ARROW keys. The LEFT ARROW and RIGHT ARROW keys can also be used to move node focus, but these keys initially try to collapse or expand a node, and only move focus when it is not possible to collapse or expand the node.
  • Node Selection – The SPACE key can be used to mark the focused node as selected or unselected. This works if selection can be applied to a node (i.e., if the SettingsSelection.Enabled property is enabled). If the SettingsSelection.Recursive property is disabled, multiple nodes can be selected by moving row focus with the ARROW keys (UP/DOWN or LEFT/RIGHT) while holding down the SHIFT key.
  • Expanding/Collapsing Nodes – The PLUS and MINUS keys can be used respectively to expand and collapse nodes. In addition, nodes can be collapsed and expanded using the LEFT ARROW and RIGHT ARROW keys.
Collapse/Expand
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
Open VB Solution
The source code files for this demo are installed (by default) in the following directories:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\ASPxTreeListDemos
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\VB\ASPxTreeListDemos