Slider

A control that allows you to select a numeric value by moving a thumb along a line with a fixed set of options.

Related sample: Form. All controls

Adding Slider

You can add a Slider control during form initialization:

const form = new dhx.Form("form_container", {
    rows: [
        {
            type: "slider",
            name:"slider",
            label: "slider",
            labelWidth: "50px",
            min: 0,
            max: 100
        }
    ]
});

Properties

View the full list of Slider configuration properties.

Working with Slider

You can manage a Slider control with the methods and events of the object that the getItem() method returns.

For example, you can get the value of the control:

const value = form.getItem("slider").getValue();

Methods

Check the full list of Slider methods.

Events

Check the full list of Slider events.

Working with the dhtmlxSlider widget

You can use DHTMLX Slider methods with the getWidget() method of a Slider control.

For example, to disable a Slider control, get the widget attached to it and call its disable() method.

const slider = form.getItem("slider").getWidget();  // -> DHTMLX Slider
slider.disable(); // disables slider

Check the full list of DHTMLX Slider methods that you can apply with the getWidget() method.