user1175969
user1175969

Reputation: 570

Place radio button's label next to the button

I have the following radio button in my view:

  <%= f.label :gender %>
  <%= f.radio_button :gender, true %> Male
  <%= f.radio_button :gender, false %> Female

The layout looks like this (each element is in a new row):

How do I make each of the above elements to appear next to each other, in the same row?

Upvotes: 0

Views: 67

Answers (2)

oreoluwa
oreoluwa

Reputation: 5633

Like @kumar mentioned, you should be able to do it this way:

<%= label_tag 'male', class: 'radio-inline' do %>
  <%= f.radio_button :gender, true %>
  Male
<% end %>

<%= label_tag 'female', class: 'radio-inline' do %>
  <%= f.radio_button :gender, false %>
  Female
<% end %>

You should also check out the collection_radio_buttons, I guess you should be able to use it for this too, not totally sure of this though:

<%= f.collection_radio_buttons :gender, [['male', true], ['female', false]], :last, :first %>

Upvotes: 1

Kumar
Kumar

Reputation: 3126

Try this

<%= label_tag 'male' do %>
  <%= f.radio_button :gender, true %>
  Male
<% end %>

<%= label_tag 'female' do %>
  <%= f.radio_button :gender, false %>
  Female
<% end %>

When you click on the text 'Male' or 'Female' the radio should be checked rather than clicking the radio itself. This will take care of that too.

Upvotes: 2

Related Questions