jquery - 数据库值不反映到 jQuery UI 滑块

Question

我在我的 rails 应用程序中使用jQuery UI Slider 。

因此，我尝试在提交表单时将 jQuery UI Slider 的值存储在我的数据库中。

我的代码如下：

  <div>
    <p>
      <%= f.label(:amount, 'Amount') %>
      <div id="slider"></div>
      <%= f.text_field(:amount, :maxlength => 3, :size => 2) %>
    </p>
  </div>

滑块的以下 jquery：

  $(function() {
    $("#slider").slider({
      range: "max",
      min: 0,
      max: 10,
      value: 0,
      slide: function(event, ui) {
        $("#amount").val(ui.value);
      }
    });
    $("#amount").val($("#slider").slider("value"));
  }); 

上述所有代码工作正常。但是当我再次编辑我的页面时，会显示滑块最小值（即 0），而不是数据库中的值。那么我该如何实现呢？

Answer 1

我认为问题在于您在value初始化滑块时将其设置为 0。试试这个代码，我没试过，但关键是除非你希望你的滑块在加载时总是设置为 0，否则你将不得不更改value初始化程序的参数。

$(function() {
    $("#slider").slider({
      range: "max",
      min: 0,
      max: 10,
      value: $("#amount").val(),
      slide: function(event, ui) {
        $("#amount").val(ui.value);
      }
    });
    $("#amount").val($("#slider").slider("value"));
  });