2012-03-18 4 views
4

非常に基本的な質問を残して申し訳ありません。フォームが送信されるとき、私のデータベースにjQuery UI Sliderの値を格納しようとしています。 text_areaなどの他の要素の場合は、 <%= f.text_area :my_score %>、またはdatepicker(using the jQuery Datepicker Rails plugin)の日付の場合は<%= f.datepicker :my_date %>で行うことができます。しかし、私はスライダーのプラグインを見つけるのに苦労しており、私の研究からは、hidden_​​fieldを使うのが最善の方法だと思われます。しかし、私はスライダの値を受け取り、フォームに正しく渡すための正しい表記法を知らない。どんな助けでも大歓迎です。jQuery UI Sliderの値をRuby on Railsのhidden_​​fieldを使用してフォームに渡すのに役立つ必要があります

スライダの
<div id="slider"></div> 
<input type="hidden" id="hidden"/> 
<%= f.hidden_field :my_score, :value => (what goes here?) %> 

Javascriptを:

<script> 
$(function() { 
    $("#slider").slider({ 
     value:100, 
     min: 5, 
     max: 200, 
     step: 5, 
     slide: function(event, ui) { 
      $("#amount").val(ui.value); 
     }, 

     change: function(event, ui) { 
      $('#hidden').attr('value', ui.value); 
      } 
    }); 
    $("#amount").val($("#slider").slider("value")); 
}); 
</script> 

答えて

8

あなたのビューコードは、単に次のようになります。

<div id="slider"></div> 
<%= f.hidden_field :my_score %> 

あなたは既に隠しフィールドを持っているが、二番目のを必要としません。また、値を必要とせず、すでにそこにあるものがあれば(つまり、編集中の)レールを挿入します。

あなたのjavascriptについては、あなたがこのような変更イベントを持っているでしょうが:

change: function(event, ui) { 
    $('input#model_name_my_score').val(ui.value); 
} 

私はあなたの隠されたフィールドがあります正確なIDを知らないが、それは通常、model_name_field_nameです。それを確認する必要があります。

最後に行うべきことは、ページの読み込み時にスライダーを適切な値に設定することです(フォームの編集版があり、既存の値があると仮定して)。

$("#slider").slider({ 
     value: $('input#model_name_my_score').val(), 

新しいオブジェクトを作成するときに、デフォルトであることを100にしたい場合は、あなたがそのモデルで100か、デフォルト値を設定したいと、これまで、そのようにレールがする場所に隠しフィールドに事前に設定する必要がありますその値は「新しい」形式になります。あなたはまだデフォルト値を扱う方法がない場合はhttps://github.com/FooBarWidget/default_value_forのような宝石をチェックアウトするかもしれません。

+0

ありがとうございます!巨大な助け、私は本当にそれを感謝します。 – diasks2

+0

ようこそ。 –