使用 simple_form 如何在这些内部标签和外部标签上获得此类？答案

【问题标题】：Using simple_form how do I get this class on these inner labels vs the outer label ones?使用 simple_form 如何在这些内部标签和外部标签上获得此类？
【发布时间】：2013-02-27 23:29:03
【问题描述】：

这就是我想要得到的结果：

<div class="control-group">
  <label class="control-label" for="ListingType">Listing Type:</label>
  <div class="controls">
    <label class="inline"><input type="radio" name="ListingType"> For Sale</label>
    <label class="inline"><input type="radio" name="ListingType"> For Rent</label>
  </div>
</div>

我试过了：

<%= f.association :listing_type, label: "Listing Type: ", as: :radio_buttons, input_html: { class: 'inline'} %>

这是生成的：

<div class="control-group radio_buttons optional">
   <label class="radio_buttons optional control-label">Listing Type:</label>
   <div class="controls">
      <label class="radio"><input class="radio_buttons optional inline" id="listing_listing_type_id_1" name="listing[listing_type_id]" type="radio" value="1" />For Sale</label>
      <label class="radio"><input class="radio_buttons optional inline" id="listing_listing_type_id_2" name="listing[listing_type_id]" type="radio" value="2" />For Rent</label>
  </div>
</div>

请注意 label.class="radio" 而不是 label.class="inline"。

这是我要正确完成的主要事情。

我尝试了label_html: { class: 'inline' }，它产生了这个：

<div class="control-group radio_buttons optional">
   <label class="radio_buttons optional control-label inline">Listing Type:</label>
   <div class="controls">
     <label class="radio"><input class="radio_buttons optional" id="listing_listing_type_id_1" name="listing[listing_type_id]" type="radio" value="1" />For Sale</label>
     <label class="radio"><input class="radio_buttons optional" id="listing_listing_type_id_2" name="listing[listing_type_id]" type="radio" value="2" />For Rent</label>
   </div>
</div>

即它将inline 类移动到最外面的<label>，而不是每个单选按钮的label。

想法？

【问题讨论】：

检查这个 SO 线程：stackoverflow.com/questions/5812325/…
完美....您想在此处添加最多支持的答案，即有 6 个支持的答案...我会接受。刚刚试了一下，效果很好。谢谢！

标签： css ruby-on-rails ruby-on-rails-3 simple-form

【解决方案1】：

只需将@flynfish 的答案从how to change class of a label for checkboxes in simple_form 复制到此线程。根据@marcamillion 在这里的评论，似乎是那个。

您可以使用此选项为标签指定类别：item_wrapper_class=> 'class_goes_here'

这是一个完整的例子：

= user.input :resident, 
         :collection => [["In the U.S", true],["Outside the U.S.", false]], 
         :label_method => :first, 
         :value_method => :last,
         :as => :radio_buttons, 
         :label => "Where is your principle residence?",
         :item_wrapper_class => 'inline'

【讨论】：

这在最新版本中不再有效，该类应用于标签类周围的跨度:( - 想知道为什么他们改变了这个:(

【解决方案2】：

@moonfly 的答案不再适用于当前版本的simple_form（我已经尝试过 3.3.1 版本）。

要更改每个单选按钮标签的类，您必须使用选项item_label_class，如下所示：

<%= f.association :listing_type, label: "Listing Type: ", as: :radio_buttons, item_label_class: 'inline' %>

或者来自@moonfly 的回答：

= user.input :resident, 
     :collection => [["In the U.S", true],["Outside the U.S.", false]], 
     :label_method => :first, 
     :value_method => :last,
     :as => :radio_buttons, 
     :label => "Where is your principle residence?",
     :item_label_class => 'inline'

item_wrapper_class 将为新版本的 simple_form 修改每个单选按钮 span 的类。

【讨论】：