Keyboard Interaction

29 Sep 20171 minute to read

With the keyboard navigation enabled in the CurrencyTextBox control, it is possible to control the actions of the CurrencyTextBox with the provided shortcut keys. Almost all the CurrencyTextBox actions that are done through mouse can be controlled with shortcut keys.

The various keyboard shortcuts available within the CurrencyTextBox control are discussed in the following table.

Keyboard Shortcuts

Shortcut Key	Description
Access key + j	Focuses the control
Up	Increments the value
Down	Decrements the value
Tab	Focus the next element

Configuring Keyboard Navigation

The following steps explain the implementation of keyboard interaction in CurrencyTextBox .

In the HTML page set the corresponding <input> elements for rendering CurrencyTextBox controls. Set the access key property to the CurrencyTextBox control for focusing the control while key is pressed.

HTML

<input id="currency" type="text" ej-currencytextbox [value]="value"/>

HTML

import { Component } from '@angular/core';

@Component({
    selector: 'ej-app',
    templateUrl: 'src/currencytextbox/currencytextbox.component.html'
})
export class CurrencyTextboxComponent {
    public value: number;
    constructor() {
        this.value = 33;
    }
}

Run the above example and press Access key + j key to focus the Textbox widget. Perform provided functionality by using keyboard shortcuts.