simple_form使用twitter引导程序使用<img/>(X)标签呈现单选按钮组?

时间:2012-06-30 08:41:07

标签: ruby-on-rails-3 radio-button twitter-bootstrap simple-form

我试着用一段时间来使用simple_form来创建下面的例子但是+标签并修复了一些样式。任何人都知道如何解决:

  • 删除 2 不知道它们来自哪里(似乎很奇怪i18n生产中的错误,它会抛出一大堆I18n)
  • 在单选按钮
  • 后面有男性或女性文字

label output

结果来自以下代码:

     .clear
    = f.label "Gender"
    = f.collection_radio_buttons(:gender, [['Male', 'icon_male'], ['Female', 'icon_female']],
                                 :first, :last,
                                 :item_wrapper_class => 'horizontal',
                                 ) do |gender|
      = gender.label { image_tag("/assets/icons/16x16/#{gender.text}.png") + gender.radio_button  }

    .clear
    .ruler

3 个答案:

答案 0 :(得分:10)

要删除2s并在右侧使用文本标签,请使用:

= f.label "Gender"
= f.collection_radio_buttons(:gender, [['Male', 'icon_male'], ['Female', 'icon_female']],
                             :first, :last,
                             :item_wrapper_class => 'horizontal',
                             ) { |gender| gender.label { image_tag("/assets/icons/16x16/#{gender.text}.png") + gender.radio_button + gender.text } }

=之前删除gender.label将删除2s。

答案 1 :(得分:8)

Rubytastic你的答案中有一个额外的逗号。 这是@ 23inhouse建议的正确代码。它适用于我

  • rails 3.1.3
  • 简单形式2.0.2
  • haml 3.1.4
  • haml-rails 0.3.4

    = simple_form_for @object_new do |f|
      .clear
      = f.label "Gender"
      - f.collection_radio_buttons(:gender, [['Male', 'icon_male'], ['Female', 'icon_female']], :first, :last, :item_wrapper_class => 'horizontal') do |gender|
        = gender.label { image_tag("rails.png") + gender.radio_button  }
      .clear
      .ruler

答案 2 :(得分:3)

最终工作片段:

= f.label "Gender"
- f.collection_radio_buttons(:gender, [['Male', 'icon_male'], ['Female', 'icon_female']], :first, :last, :item_wrapper_class => 'horizontal') do |gender|
  = gender.label { image_tag("/assets/icons/16x16/#{gender.text}.png") + gender.radio_button  }
.clear
.ruler