7

I'm trying to make a star rating form with radio collection using FontAwesome, for this I actually need to change the label classes of the collection_radio_button input generated by simple_form but can't find any obvious solution.

So far I use:

form_for @user do |f|
  f.collection_radio_buttons :rating, [[1, 'Bad'] ,[2, 'Ok'], [3, 'Great']],
                             :first, :last, { item_wrapper_tag: false }
end

Which generates:

<input id="review_rating_1" name="review[rating]" type="radio" value="1" />
<label class="collection_radio_buttons" for="review_rating_1">Bad</label>
<input id="review_rating_2" name="review[rating]" type="radio" value="2" />
<label class="collection_radio_buttons" for="review_rating_2">Ok</label>
<input id="review_rating_3" name="user[options]" type="radio" value="3" />
<label class="collection_radio_buttons" for="review_rating_3">Great</label>

But I'd like the labels to have an extra class, like:

<input id="review_rating_3" name="user[options]" type="radio" value="3" />
<label class="collection_radio_buttons icon-star" for="review_rating_3">Great</label>

UPDATE: This class is defined statically at: https://github.com/plataformatec/simple_form/blob/master/lib/simple_form/tags.rb#L43

2
  • Could try adding label_html: { class: 'icon-star' } as an option
    – spullen
    Jun 19, 2013 at 12:56
  • I have tried without success. I actually realize that this source changed a bit in the latest version of simple_form and are now looking the source for 2.1 instead of 3.0.0.rc to better understand how to deal with it. Jun 19, 2013 at 13:43

2 Answers 2

13

This can be achieved by using a block:

form_for @user do |f|
  f.collection_radio_buttons :rating, [[1, 'Bad'] ,[2, 'Ok'], [3, 'Great']],
                             :first, :last, { item_wrapper_tag: false } do |b|
    b.radio_button + b.label(:class => "collection_radio_buttons icon-star")
  end
end

This doc can showcase some other example: http://rubydoc.info/github/plataformatec/simple_form/SimpleForm/FormBuilder:collection_radio_buttons

2
  • 1
    Searched for this answer for hours. If you want to add the class to the input radio buttons, which is what I was looking for, use this: b.radio_button(:class => "collection_radio_buttons icon-star") + b.label(:class => "collection_radio_buttons icon-star") Aug 4, 2014 at 12:05
  • This doesn't work any more. All it will do is make your labels disappear completely. Oct 5, 2020 at 21:22
1

In case anyone wonders how to add class to label wrapping radiobutton input when you set boolean_style = :nested here is what I came with:

You can set option called :item_label_class when calling your input, f.e.:

<%= f.input :type, as: :radio_buttons,
                   collection: Listing::TYPES.map{ |type| [Listing.translate_type(type), type] },
                   label: false,
                   item_label_class: 'radio' %>

I wanted to automate this stuff, so I defined custom CollectionRadioButtonsInput class. You need to add to method apply_default_collection_options!:

def apply_default_collection_options!(options)
  super(options)
  options[:item_label_class] == 'radio' if input_type == :radio_buttons
end
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.