Razorフィールドを埋め込むJqueryスライダー

Question

Razor構文内のフィールドにデータを入力してjQueryスライダを操作しようとしています。私はjQueryのコードを、次のことで、この作業がhttps://jqueryui.com/slider/#rangemax見つかっ持っているが、私は何を持っていることは、以下の

カミソリでカミソリ

内部

を取り込み、その後にこれを得ることに問題を抱えています：

<div class="form-group"> 
     @Html.LabelFor(model => model.SunsdayMinutes, htmlAttributes: new  {@class = "control-label col-md-2" }) 
    <div class="col-md-10"> 
      @Html.EditorFor(model => model.SunsdayMinutes, new {  htmlAttributes = new { @class = "form-control" } }) 
      @Html.ValidationMessageFor(model => model.SunsdayMinutes, "",  new { @class = "text-danger" }) 
     </div> 
    </div> 
<hr /> 

のjQuery：

@section Scripts {  
     @Scripts.Render("~/bundles/jqueryval") 
     <script type="text/javascript"> 

    $(function() { 
     $("#slider-range-max").slider({ 
      range: "max", 
      min: 1, 
      max: 10, 
      value: 2, 
      slide: function (event, ui) { 
       $("#amount").val(ui.value); 
      } 
     }); 
     $("#amount").val($("#slider-range-max").slider("value")); 
    }); 
    </script> 
    } 

私は金額を新しいものに入れようとしましたが、それは剃刀コードの周りにラップしてみましたが、まだ動作しません。

多くのありがとう

Answer 1

開発ツールを使用してブラウザのコードを検査する必要があります。すべての関連要素のIDを確認し、すべてがサンプルと一致することを確認します。

あなたは、コードを変更する必要があるので、あなたのエディタテンプレートのIDはSunsdayMinutes次のようになります。

$('#SunsdayMinutes').val($('#slider-range-max').slider("value")); 

明らかにあなたはまた、スライダーのdivを含める必要があります。

<div id="slider-range-max"></div> 

は必ずすべてのことを確認してください関連するjQuery UIライブラリが含まれており、バージョンによって競合が発生することはありません。