如何将模型值绑定到kendo.ui.Slider？

Question

我在下面我的MVC应用程序中使用kendo.ui.Slider：

@(Html.Kendo().Slider() 
       .Name("slider") //The name of the slider is mandatory. It specifies the "id" attribute of the widget. 
       .Min(0) //Set min value of the slider 
       .Max(100000) //Set min value of the slider 
       .Value(50000) //Set the value of the slider 
       .SmallStep(1000) 
       .LargeStep(10000) 
       .HtmlAttributes(new { style = "width:700px;" }) 
         .Tooltip(tooltip => 
         { 
          tooltip.Format("{0:n0}"); 
         }) 
       .Events(e => 
         { 
          e.Change("sliderOnChange"); 
         }) 
      ) 
      <script> 
       function sliderOnChange(e) { 
        var slider = $("#slider").data("kendoSlider"); 
        var sliderValue = slider.value(); 
        alert(sliderValue); 
       } 
      </script> 

我怎样才能绑定模型值，而不是（.value的（50000））在这里分配静态价值？

Answer 1

型号

如果你有一个模型，具体如下：上述

public class AModel 
{ 
    public int? Percentage { get; set; } 
} 

允许的财产，以对模型的动作中进行设置。

然后，您可以使用一个SliderFor而非Slider

查看

@(Html.Kendo().SliderFor(m => m.Percentage) 
       .Min(0) //Set min value of the slider 
       .Max(100000) //Set min value of the slider 
       .SmallStep(1000) 
       .LargeStep(10000) 
       .HtmlAttributes(new { style = "width:700px;" }) 
         .Tooltip(tooltip => 
         { 
          tooltip.Format("{0:n0}"); 
         }) 
       .Events(e => 
         { 
          e.Change("sliderOnChange"); 
         }) 
      ) 

通知的去除Name财产及以上Value制定者。

由于Percentage属性在您的视图模型中定义，因此它会自动呈现为Slider的Name属性。

这使得模型粘合剂把它捡起来，并发布你的模型对象中的设定值。