在Rails中保存Scriptaculous滑块值

时间:2011-02-26 00:28:25

标签: ruby-on-rails-3 slider

自己想出来,解决方案如下。

我正在尝试一次保存一个动态数量的滑块值。主题has_many特征has_many评级。滑块值需要保存为评级。受试者具有动态数量的特征。

现在,滑块会更新具有动态ID的隐藏字段的值。我无法将隐藏字段值传递给rating / create。

我想要完成的是一个主题节目视图,它列出了动态的特征数,每个特征都有一个滑块。我想将滑块的值一个接一个地保存为保存按钮或链接,作为评级。

非常感谢任何帮助。

科目 - show.html.erb:

<style type="text/css">
  div.slider { width:256px; margin:10px 0; background-color:#b3b3b3; height:10px; position: relative; }
  div.slider div.handle { width:10px; height:15px; background-color:#474747; cursor:move; position: absolute; }
</style>

<p id="notice"><%= notice %></p>

<h1>
  <%= @subject.name %>
</h1>

<p>
  <%= @subject.description %>
</p>

<table>
  <tr>
    <th>Traits</th>
  </tr>

  <% @subject.traits.each do |trait| %>
    <tr>
      <td><%= link_to trait.name, trait %></td>&nbsp; &nbsp; &nbsp;
      <td><%= link_to 'Edit', edit_trait_path(trait) %></td>&nbsp;
      <td><%= link_to 'Destroy', trait, :confirm => 'Are you sure?', :method => :delete %></td>
    </tr>
    <tr>
        <td>
          #Slider value is sent here onChange. This value needs to be passed to rating#create
          <input id="trait.id", name="rating[value]", value="50" />

          <div id="s<%= trait.id %>" class="slider">
            <div class="handle"></div>
          </div>

          <script type="text/javascript">
            (function() {
              var trait_slider = $('s<%= h trait.id %>')

              new Control.Slider(trait_slider.down('.handle'), trait_slider, {
                range: $R(0, 100),
                sliderValue: 50,
                onChange: function(v) { $('<%= h trait.id %>').value = v }
              });
            })();
          </script>
        </td>
        <td>
          #How the hell do I save each slider value??? is this the best way of doing it?
          <%= link_to "save", :controller => "ratings", :action => "create" %>
        </td>
    </tr>
<% end %>
</table>

<br /><br /><%= render 'traits/form' %>

<%= link_to 'Edit', edit_subject_path(@subject) %> |
<%= link_to 'Back', subjects_path %>

1 个答案:

答案 0 :(得分:1)

SOLUTION:多个表单和动态隐藏的div ID

<% @subject.traits.each do |trait| %>
    <%= form_for @rating do |rf| %>
      <tr>
        <td><%= link_to trait.name, trait %></td>&nbsp; &nbsp; &nbsp;
        <td><%= link_to 'Edit', edit_trait_path(trait) %></td>&nbsp;
        <td><%= link_to 'Destroy', trait, :confirm => 'Are you sure?', :method => :delete %></td>
      </tr>
      <tr>
          <td>
            <input id="<%= trait.id %>", name="rating[value]", type="hidden", value="50" />
            <%= rf.hidden_field :trait_id, :value => trait.id %>
            <%= rf.hidden_field :subject_id, :value => @subject.id %>

            <div id="s<%= trait.id %>" class="slider">
              <div class="handle"></div>
            </div>

            <script type="text/javascript">
              (function() {
                var trait_slider = $('s<%= h trait.id %>')

                new Control.Slider(trait_slider.down('.handle'), trait_slider, {
                  range: $R(0, 100),
                  sliderValue: 50,
                  onChange: function(v) { $('<%= trait.id %>').value = v }
                });
              })();
            </script>
          </td>
          <td> 
            <div class="actions">
              <%= rf.submit "Save Rating" %>
            </div>
          </td>
      </tr>
    <% end %>
  <% end %>