Keyboard Interaction

1 Oct 20151 minute to read

You can use Keyboard shortcut keys as an alternative to the mouse for using the Slider control. All options in the Slider can be accessed by using keyboard shortcuts. The following table explains the keyboard shortcut keys and the operations that can be performed by using the corresponding keys.

Shortcut Key Description
Alt + j                            Focuses into the Slider handle.
Up/Right Increments the Slider value.
Down/Left Decrements the Slider value.
Home Slider handle moves to the start value.
End Slider handle moves to the end value.
Esc Focuses out from the Slider handle.

Configure keyboard interaction

The following steps explain you how to enable keyboard support in the Slider.

In an ASPX page, define the Slider control with Range Slider. 

  • HTML
    • <ej:Slider ID="rangeSlider" runat="server" Width="500" Values="25,75" SliderType="Range"></ej:Slider>

    In JavaScript, focus the Slider control in document key down function. 

  • JS
    • $(document).on("keydown", function (e) {

	if (e.altKey && e.keyCode === 74) { // j- key code.

		$(" #<%=rangeSlider.ClientID%> a")[0].focus();

	}

});