Simple_form bootstrap_slider Parameter

Question

Ich benutze Simple_form und ein Bootstrap_slider in einer verschachtelten Form. Wie übertrage ich die Setup-Parameter?

Ich verwende dieses

<%= f.input_field :proficiency, class: 'agt_prof_slider' %> 

der gut arbeitet. Die Klasse wird von jquery verwendet, um ein anderes Feld zu aktualisieren. die Sache, die ich nicht tun konnte, ist den Anfangswert festlegen. Bootstrap_slider möchte dies:

<input id="ex6" type="text" data-slider-min="-5" data-slider-max="20" data-slider-step="1" data-slider-value="3"> 

Wie kann ich den "Daten-Slider-Wert" in f.input_field enthalten? Dies ist Teil eines verschachtelten Abschnitts, also brauche ich die automatisch generierten IDs usw. Ich muss nur den ursprünglichen Wert in den Schieberegler erhalten, damit das Formular für einen Bearbeitungsbildschirm funktioniert.

Die Klasse 'agt_prof_slider' ist das, was ich in meinem Jquery verwenden, zum Beispiel

$('.agt_prof_slider').slider() 

Answer 1

Die Antwort endete mehr jQuery zu sein. Hier ist meine Lösung.

In der ursprünglichen Form:

<div id="int_skill_container" > 
    <%= f.simple_fields_for :int_skills do |skill| %> 
    <%= render 'int_skill_fields', :f => skill %> 
    <% end %> 
    <%= link_to_add_association "Add a Skill Pair", f, :interpreter_skills, :partial => 'int_skill_fields', :class => 'btn btn-primary' %> 
</div> 

Die Felder:

<div class='nested-fields'> 
    ... 
    <td> 
    <b><span class="agt_prof_slider_val"><%= f.object.proficiency or 5 %></span></b>&nbsp;&nbsp;&nbsp; 
    <%= f.input_field :proficiency, class: 'agt_prof_slider' %> 
    </td> 
    ... 
</div> 

und die jQuery

mySlider = $('.agt_prof_slider').slider() 
mySlider.each -> 
    init_val = parseInt($(this).closest("td").find('.agt_prof_slider_val').text()) 
    $(this).slider('setValue', init_val) 
$('.agt_prof_slider').on 'slide', (slideEvt) -> 
    $(this).closest("td").find('.agt_prof_slider_val').text slideEvt.value 

$('#int_skill_container').on 'cocoon:after-insert', (e, insertedItem) -> 
    insertedItem.find('.agt_prof_slider').first().slider() 
    insertedItem.find('.agt_prof_slider').first().on 'slide', (slideEvt) -> 
    $(this).closest("td").find('.agt_prof_slider_val').text slideEvt.value 

Ich zeige den Wert neben dem Schieberegler. Im Bearbeitungsformular werden diese Werte auf dem Anfangsformular-Bildschirm eingestellt, also nehme ich das, um den anfänglichen Schiebereglerwert mit 'setValue' zu setzen.

Der zweite Teil des jQuery-Krams ist wirklich der gleiche, aber da ich Cocoon für verschachtelte Variablen verwende, musste ich den Code im Grunde in einem Cocoon-Callback wiederholen. Hier ist der Standard-Schiebereglerwert von 5 in Ordnung.