Simple_Form_For Rails Radio Button Inline

simple_form_for rails radio button inline

If you want them inline, you need to give the labels the inline class by doing: :item_wrapper_class => 'inline'

Here is an example using your code:

= f.input :is_private, 
          :collection => [[true, 'Private'], [false, 'Public']], 
          :label_method => :last, 
          :value_method => :first,
          :as => :radio_buttons, 
          :item_wrapper_class => 'inline',
          :checked => true

EDIT: I just realized that my answer was more specific to simple_form + bootstrap, since bootstrap already has styles defined when giving the label's the inline class. You should be able to use my example though, it will just take some more work on your end in creating your custom css.

Simple Form Radio Buttons - Display inline

Add radio-inline class to your radio buttons.

Refer: http://getbootstrap.com/css/#forms

How to generate a radio-inline label with simple_form and bootstrap?

By getting inspiration form this answer I managed to do it by creating a :radio_buttons_inline input type.

Create the file:

app/inputs/radio_buttons_inline_input.rb

with this content:

class RadioButtonsInlineInput < SimpleForm::Inputs::CollectionRadioButtonsInput
  def input
    label_method, value_method = detect_collection_methods
    @builder.send("collection_radio_buttons", attribute_name, collection, value_method,
      label_method, input_options, input_html_options, 
      &collection_block_for_nested_boolean_style)
  end

  protected
    def item_wrapper_class
      "radio-inline"
    end
end

And then use it in your view like so:

<%= simple_form_for @visitor do |f| %>
    <%= f.error_notification %>
     <%= f.input :favourite, :as => :radio_buttons_inline%>
<% end %>

This renders the html as:

<div class="control-group radio_buttons_inline required visitor_favourite">
    <div class="controls">
        <label class="radio-inline">
            <input class="radio_buttons_inline required" id="visitor_favourite_true" name="visitor[favourite]" type="radio" value="true" />
               Yes
        </label>
        <label class="radio-inline">
            <input class="radio_buttons_inline required" id="visitor_favourite_false" name="visitor[favourite]" type="radio" value="false" />
            No
        </label>
    </div>
 </div>

rails3, simple_form, twitter bootstrap: radio buttons break onto differnet lines

try this

<%= f.input :save_it, :collection => [['Yes',true] ,['No', false]], :as => :radio_buttons, :item_wrapper_class => 'inline', :label => 'Save now?' %>

Simple form wrap html and methods around radio buttons

Answer provided by Kh Ammad in the comment, the resulting code gives the equivalent post values, and achieves the result. Many thanks!

<table width="100%"> 
  <% Application.application.active_admin_subscription_levels.each do |level| %> 
    <tr>
      <td width="20%">
         <%= f.radio_button(:subscription_level_id, level.id) %> <%= level.name %>
      </td> 
      <td>
        <%= level.description %>
      </td> 
    </tr> 
  <% end %> 
</table>

Radio buttons using Simple Form in Rails 4

The document is easy to understand.

- (Object) collection_radio_buttons(method, collection, value_method, text_method, options = {}, html_options = {}, &block) 

collection_radio_buttons have those params .

f.collection_radio_buttons :options, [[true, 'Yes'] ,[false, 'No']], :first, :last

For this expamle

• :options is method name.
• [[true, 'Yes'] ,[false, 'No']] is the collection, it's an array of array, all the member has the stucture of [value, lable].
• :first is the radio button's value_method, means to get how to get value from every member of the collection, use first method can get true and false from the members in the collection.
• :last is the radio button's text_method, to generate lable for every radio button.

So you may just use replace the method name to project_image and add another lable like this:

<%=f.collection_radio_buttons :project_image, [[true, 'Yes'] ,[false, 'No']], :first, :last %>
<%=f.lable  :project_image, 'Would you like add an image to your project pitch?'%>

---

Related Topics