Blazor | ComponentOne
Controls / Input Controls / RangeSlider / Range
In This Topic
    Range
    In This Topic

    RangeSlider allows you to set a numeric range on a continuous range of possible values. It lets you set the range boundaries of the slider, on the slider track, by specifying Minimum and Maximum properties of the C1RangeSlider class. In other words, the Minimum and Maximum properties set the possible range of values allowable in the RangeSlider control. By default, the Minimum property is set to 0 and the Maximum property is set to 100 in the RangeSlider control but you can change the value of these properties through code. Along with the Minimum and Maximum property, the LowerValue and the UpperValue thumbs are also set at the default values, i.e., 0 and 100, respectively.

    The following image shows the range boundaries set at -10 as the minimum possible value and 100 as the maximum possible value for the range.

    Blazor RangeSlider with Specified Range

    To change the maximum and minimum possible values for the RangeSlider control, use the following code. In this example, we have set the Minimum property to -10 and the Maximum property to 100.

    Index.razor
    Copy Code
    <C1RangeSlider Minimum=-10 Maximum=100></C1RangeSlider>