Check documentation for the latest version of dhtmlxSuite Range Mode DHTMLX Docs

Range Mode

In this mode you can use two handles for selecting some range of values. The same as a one-handle slider the two-handle one can be either horizontal or vertical. It can work with decimal values and tooltips, and runs flawlessly in the inversed mode. All the standard dhtmlxSlider API is supported.



To enable the range mode, you need to set the range property to true and specify an array of two values: min and max values of the range:

mySlider = new dhtmlXSlider({
    parent: "sliderObj",
    linkTo: ["sliderLink", "sliderLink2"],
    step: 1,
    min: 10,
    max: 30,
    value: [15, 25],
    range: true
});

Related sample:  Range mode


Note that the "linkTo" and "value" attributes should have the array type and contain a pair of values for both handles.

The same concerns the getValue method. For the range mode it returns an array with a pair of values. The first parameter for setValue should be an array, respectively.

Back to top