2014-01-30 54 views
5

我有一個表單使用form_for,我想實現一個JavaScript滑塊使用bootstrap-slider.js來獲取一個值並更新事件的價格。Javascript Slider in Rails表格

Javascript絕對不是我的強項,我期待看到我將如何在表單中加入這一點。

之一規定的例子是:

################### 
     HTML 
################### 

<input id="ex8" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/> 


################### 
    JavaScript 
################### 

$("#ex8").slider({ 
    tooltip: 'always' 
}); 

我現在的形式如下:

<%= form_for(@event) do |f| %> 
    <%= render 'shared/event_error_messages' %> 


    <%= f.label :name %> 
    <%= f.text_field :name %> 

    <%= f.label :content %> 
    <%= f.text_field :content %> 

    <%= f.label :location %> 
    <%= f.text_field :location %> 

    <%= f.label :date%>mm/dd/yyyy 
    <%= f.text_field :date %> 

    <%= f.submit "Create event", class: "btn btn-large btn-primary" %> 
     <% end %> 

我主要是不明白如何實現形式的JavaScript/HTML和隨後將其傳遞到數據庫中的事件價格。

回答

6
<%= f.text_field :price, id: 'ex8', type: 'text', 
       data: {'slider-id' => 'ex1Slider', 
         'slider-min' => '0', 
         'slider-max' => '20', 
         'slider-step' => '1', 
         'slider-value' => '14' } %> 

將它添加到您的表單中。 另請將示例中的javascript添加到assets/javascripts文件夾中的events.js

所有剩下的插件會爲你做,我想。

+2

謝謝@peter!這讓我走上了正軌。 – adanot