2016-03-19 31 views
1

私はSimpleForm + Bootstrapを使用しています。次のように私は、チェックボックスの入力直後<i></i>タグを追加する必要:だから私は、初期化子simple_formがカスタムラッパーにデフォルトラベルを適用しないようにするにはどうすればいいですか?

#initializers/simple_form_bootstrap.rb 
config.wrappers :vertical_boolean, tag: 'div', class: 'form-group', error_class: 'has-error' do |b| 
    b.use :html5 
    b.optional :readonly 

    b.wrapper tag: 'div', class: 'checkbox' do |ba| 
    ba.wrapper tag: 'label' do |bb| 
     bb.use :input 
     bb.wrapper tag: 'i' do |baa| 
     end 
     bb.use :label_text 
    end 
    end 

    b.use :error, wrap_with: { tag: 'span', class: 'help-block' } 
    b.use :hint, wrap_with: { tag: 'p', class: 'help-block' } 
end 

を変更しかし、これは余分なラベルタグ

<div class="form-group"> 
    <div class="checkbox"> 
    <label> 
    <label class="checkbox"> 
     <input type="checkbox" > 
     <i></i> 
     Label Text 
    </label> 
    </label> 
    </div> 
</div> 

label.checkboxを挿入している

<div class="form-group"> 
    <div class="checkbox"> 
    <label class="checkbox"> 
     <input type="checkbox" > 
     <i></i> 
     Label Text 
    </label> 
    </div> 
</div> 

simple_formによって適用されるデフォルトのラベルです。すなわち、 config.boolean_label_class = 'checkbox'を経由します。だから私は私のカスタムラベルラッパーを削除することができますように見えます。

b.wrapper tag: 'div', class: 'checkbox' do |ba| 
    # ba.wrapper tag: 'label' do |bb| 
    bb.use :input 
    bb.wrapper tag: 'i' do |baa| 
    end 
    bb.use :label_text 
    # end 
end 

しかし、ラベルは入力を囲むだけです。

<div class="form-group"> 
    <div class="checkbox"> 
    <label class="checkbox"> 
     <input type="checkbox" > 
    </label> 
    <i></i> 
    Label Text 
    </div> 
</div> 

inline_labelを有効にして無効にしようとしました。私はデフォルトのsimple_formラッパーを含む新しい設定ファイルを使用しています。唯一の変更は上記のとおりです。

use label_inputが呼び出されていない場合、Simple_Formが入力にラベルを適用するのはなぜですか?

入力を包むようにsimple_formを設定するには、<i>というタグとラベルのテキストにラベルを付けますか?

答えて

0

これは、頭痛の原因になりましたが、最終的には簡単な修正がありました。表示されていない追加要素「魔法」と期待通りに同様の問題に遭遇し、誰の利益のために

は、この変更の後、あなたの初期化子

#simple_form.rb 

# disable the default :nested boolean style 
# and enable :inline 
config.boolean_style = :nested 
config.boolean_style = :inline 

に次の変更を行い、私のカスタムラッパーを振る舞いました。

関連する問題