2016-03-30 13 views
1

現在のレールアプリケーション(このプロジェクトでは以前に開発された他の開発者)でsimple form simple_form (v: 3.2.1)bootstrapを使用しています。 collectionからラジオボタンを作成するために、私はここに空のスパン<span></span>が実際にチェックボックスを表示するためのことを作成された時simple_formチェックボックスはチェックボックスの兄弟範囲を生成しません

<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> 

ルックのようなHTMLを生成

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

を使用しています。

私のCSSコード:

.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; 
} 

今私の問題は、単純なフォームにはチェックボックスがチェックボックスのために示されていない理由ですcheckbox要素のための余分なspanを作成しませんです。チェックボックスのために生成されたHTMLはどのようにチェックボックスのためにも、余分なspanを生成することができます

<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> 

のですか? (既に多くの場所を使用していたのでCSSを変更したくない)

simple_form_bootstrap.rbで何かをしなければならないようですが、わかりません。以前の開発者がいくつかのメソッドをオーバーライドできるかもしれませんが、私はそれがどこにあるのか分かりません。

答えて

0

以下は、check_boxを折り返す例です。それらは同じ方法で扱われるので、 'options'パラメータを使用して、キー "collection_wrapper_tag"で必要なデータを渡すことができます。 simple_formの "form_builder"クラスに入り、あなた自身でそれを見つけることができます。

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

ベストソリューションは、単純フォームのBooleanInputでlabel_inputメソッドを上書きすることでした。

アプリ/入力/ boolean_input.rbでboolean_inputファイルを追加します。私は、ラベルのみがインラインとnested_boolean_styleとされていない場合にはsibblingスパンを追加

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 

お知らせ? =真。 メソッド内のコードのほとんどは、単純な形式で元のものからコピー貼り付けされています。

関連する問題