2016-03-30 11 views
1

Ich verwende simple form simple_form (v: 3.2.1) mit bootstrap in meiner aktuellen Rails-Anwendung (andere Entwickler zuvor an diesem Projekt gearbeitet). Für Radio-Button aus collection Erstellen ichSimple_form Kontrollkästchen erzeugt keine Geschwisterspanne für Kontrollkästchen

= f.input :default_ship, 
      label: 'foo)', 
      collection: default_ship_options(@company), 
      as: :radio_buttons 

, die HTML erzeugen wie

<span class="radio radio radio"><label for="foo"><input class="radio_buttons required" required="required" aria-required="true" type="radio" value="company" name="purchasing_source[default_ship]" id="foo"><span></span>Test Shipping Address</label></span> 

Schauen Sie sich hier eine leere Spanne <span></span> tatsächlich erstellt wird, dass für die Ansicht Kontrollkästchen.

Mein CSS-Code:

.radio, .checkbox { 
position: relative; 
display: block; 
margin-top: 10px; 
margin-bottom: 10px; 
} 

.radio label, .checkbox label { 
min-height: 20px; 
padding-left: 20px; 
margin-bottom: 0; 
font-weight: normal; 
cursor: pointer; 
} 

label input[type=checkbox], label input[type=radio] { 
display: none; 
} 

label input[type=checkbox] + span, label input[type=radio] + span { 
display: inline-block; 
width: 1.4em; 
height: 1.4em; 
margin-right: 0.5em; 
vertical-align: middle; 
cursor: pointer; 
border: 1px solid #AAA; 
} 

Nun mein Problem ist einfache Form schafft keine zusätzliche span für checkbox Element, das ist, warum kein Kontrollkästchen für Kontrollkästchen angezeigt wird. Erzeugten HTML für Checkbox ist

<span class="checkbox"><label for="manufacturer_currencies_fr"><input class="check_boxes optional" type="checkbox" value="fr" name="manufacturer[currencies][]" id="manufacturer_currencies_fr">Euro</label></span> 

Wie kann ich zusätzliche erzeugen span auch für Kontrollkästchen? (Ich möchte nicht mein CSS ändern, weil es bereits viele Orte verwendet)

Es scheint mir, dass ich etwas unter simple_form_bootstrap.rb tun muss, aber nicht sicher. Es kann auch sein, dass ein früherer Entwickler eine Methode überschreiben kann, aber ich habe keine Ahnung, wo ich das finden kann.

Antwort

0

Hier ist ein Beispiel für das Wrapping von check_boxes. Sie werden auf dieselbe Weise behandelt, daher können Sie den Parameter 'options' verwenden, um die notwendigen Daten mit dem Schlüssel "collection_wrapper_tag" zu übergeben. Sie können in die Klasse "form_builder" von simple_form gehen und sie selbst finden.

= f.collection_check_boxes :tariffs, @form.tariffs, :first, :last, {checked: @form.selected_tariffs, collection_wrapper_tag: 'span'} 
-1

Die beste Lösung, die ich gefunden habe, war die label_input Methode auf BooleanInput des einfachen Formulars zu überschreiben.

Fügen Sie die boolean_input Datei in app/Ein-/boolean_input.rb:

class BooleanInput < SimpleForm::Inputs::BooleanInput 

    def label_input(wrapper_options = nil) 
    if options[:label] == false || inline_label? 
     input(wrapper_options) 
    elsif nested_boolean_style? 
     html_options = label_html_options.dup 
     html_options[:class] ||= [] 
     html_options[:class].push(boolean_label_class) if boolean_label_class 

     merged_input_options = merge_wrapper_options(input_html_options, wrapper_options) 

     build_hidden_field_for_checkbox + 
      @builder.label(label_target, html_options) { 
      template.content_tag(:div, class: 'switch-checkbox') { 
       build_check_box_without_hidden_field(merged_input_options) + 
       content_tag(:span, '', class:'slider round') 
      } + label_text 
      } 
    else 
     input(wrapper_options) + label(wrapper_options) 
    end 
    end 


end 

Beachten Sie, dass ich nur die sibbling Spanne für den Fall hinzugefügt wird ein Etikett inline nicht und mit nested_boolean_style? = wahr. Der meiste Code in der Methode wird vom Original in einfacher Form kopiert.

Verwandte Themen