Skip to main content

Work with Slider

The Slider API helps you control the functionality of the component through a set of handy methods.

Disabling/enabling Slider#

You can control the activity of the slider via the disable()/enable() methods:

// disable a slider on a pageslider.disable();
// make the slider active againslider.enable();

Related sample: Slider. Disable/Enable Slider

Checking if a slider is disabled#

To check if a slider is disabled, call the isDisabled() method:

slider.isDisabled(); // -> true/false

Related sample: Slider. Is Disabled Slider

Setting value#

While a user sets the value of a slider by dragging the thumb to the desired position, you can set the value from the code via the setValue() method:

slider.setValue(20);

Related sample: Slider. Set Slider Value

Getting value#

You can get the current value of Slider with the help of the getValue() method.

var value = slider.getValue(); // -> [20] // for a range slider as an arrayvar value = slider.getValue(); // -> [20,50]

Related sample: Slider. Get Slider Value

In case you've set the value of Slider as an array where the first number is greater than the second one, e.g. [50,20], getValue() will return the value as an array with numbers in the ascending order, that is [20,50].

// sets value as an array (the first number is greater than the second one)slider.setValue([50,20]);
// returns an array of numbers (the numbers are ascending)var value = slider.getValue(); // -> [20,50]