Edit this page

Use the RangeSliderFor Method

The RangeSlider HtmlHelper renders two hidden inputs behind the scenes.

This behavior helps you consume and process a model property that holds an array of 2 numbers—start and end.

The following example demonstrates a very basic approach for using, consuming, and updating such a model with the RangeSliderFor method.

Example
public class MyModel
{
    public int ID { get; set; }
    public double[] values { get; set; }
}
public ActionResult Index()
{
    return View(new MyModel { ID = 1, values=new double[] { 1, 2 } });
}

public ActionResult UpdateMyModel(MyModel model)
{
    // ToDo: Update the model in the database
    return View("Index", model);
}
@model TelerikMvcApp.Models.MyModel

@using (Html.BeginForm("UpdateMyModel", "Home"))
{
    @Html.HiddenFor(model => model.ID)
    @(Html.Kendo().RangeSliderFor(model => model.values))
    <input type="submit"  value="Submit" />
}

See Also