Slider Tag Helper Overview

The Slider tag helper helps you configure the Kendo UI Slider widget in ASP.NET Core applications.

Basic Usage

The following example demonstrates how to define the Slider by using the Slider tag helper.

Example

    <kendo-slider name="slider"
                  increase-button-title="Right"
                  decrease-button-title="Left" 
                  min="0" max="30"
                  small-step="1"
                  large-step="10"
                  value="18" class="temperature" title="slider"></kendo-slider>

Configuration

The Slider tag helper configuration options are passed as attributes of the tag.

Example

        @(Html.Kendo().Slider()
            .Name("slider")
            .IncreaseButtonTitle("Right")
            .DecreaseButtonTitle("Left")
            .Min(0)
            .Max(30)
            .SmallStep(1)
            .LargeStep(10)
            .Value(18)
            .HtmlAttributes(new { @class = "temperature" }))

        <kendo-slider name="slider"
                      increase-button-title="Right"
                      decrease-button-title="Left" 
                      min="0" max="30"
                      small-step="1"
                      large-step="10"
                      value="18" class="temperature" title="slider"></kendo-slider>

The following example demonstrates how to define the RangeSlider by using the RangeSlider tag helper.

Example

    <kendo-rangeslider name="rangeslider" class="humidity"
                       min="0" max="10"
                       small-step="1"
                       large-step="10"></kendo-rangeslider>

See Also

• Overview of Telerik UI for ASP.NET Core
• Get Started with Telerik UI for ASP.NET Core in ASP.NET Core Projects
• Get Started with Telerik UI for ASP.NET Core in ASP.NET Core Projects on Linux
• Known Issues with Telerik UI for ASP.NET Core