ドロップダウンの選択に基づいて値を動的に取得する

Question

私はドロップダウンメニューを持つフォームを使用して、アイテムを予約する頻度を選択することができます。私はstripeにお支払いを処理させていただきます。私はlengthを選択に基づいて動的に検索したいと思います。

<%= form_tag pages_next_url(@booking), :length => params[:length] do %> 

    <div class="input-field"> 
     <!--<%= label :length, "How long will you stay?" %>--> 
     <%= select_tag "length", options_for_select(@garage_times.map { |obj| [obj['time'], obj['value']] }) %> 
    </div> 

    <%= hidden_field_tag :garageid, @garage.id %> 

    <script src="https://checkout.stripe.com/checkout.js" class="stripe-button" 
      data-key="<%= Rails.application.secrets.stripe_publishable_key %>" 
      data-description="Payment" 
      data-amount= <%= garage.weekday*100*length %> <-- need to get length (integer) dynamically 
      data-locale="auto" 
      data-email= <%= current_user.email %> ></script> 
<% end %> 

私のコントローラには、値が記載されています。 「1:00時」を選択した場合、この場合はlength,1が動的に返されます。

@garage_times = [ 
{"value" => 1, "time" => "1:00 hour"}, 
{"value" => 2, "time" => "2:00 hours"}, 
{"value" => 3, "time" => "3:00 hours"}, 
{"value" => 4, "time" => "4:00 hours"} 
] 

動的に値を取得するには、AJAX/JSが必要であることを理解しています。私はいくつかの研究を行い、Railscastをダイナミックな形で見ました。しかし、私の場合は助けにならない。私が見たすべての例は、modelから値を取得しています。また、私はコントローラに計算を入れることもできますが、支払い情報を入力するときにユーザーが支払いボタンの合計金額を確認できるようにすることがポイントです。

私を導いてください。私はJSとAJAXの知識はほとんど持っていません。ありがとうございました。

編集： まだこの問題は解決できません。

Answer 1

AJAXの使用を避けて、選択リストvalueを使用しているようです。次に、length値を使用してボタンを更新します。私はあなたが言及した方法で行うことが可能であるかどうかわからないのです

$('#length').on('change', function() { 
    weekday_rate = $('#weekday_rate').html(); 
    length = $(this).val(); 
    $('.stripe-button').attr('data-amount', weekday_rate * 100 * length) 
})