RPF Design System for Rails
x
1
2
3
4
5
6
<form class="new_person" id="new_person" action="#" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="TKJsvgn_4zLJ9D6sZKuQ8D9Ml7RzwLG45SXpmqNHOU6GEAFGXBwV5q1a5oCMA0_EwUdqW_ZdaXtOZetkjlVnHw" autocomplete="off" />
<label class="rpf-input-radio"><input id="person_berry_raspberry" name="person[berry]" type="radio" value="raspberry">
  <em>Raspberries</em> are my choice
</label>  <label class="rpf-input-radio"><input id="person_berry_gooseberry" name="person[berry]" type="radio" value="gooseberry">
  <em>Gooseberries</em> are my choice
</label></form>
1
2
3
4
5
6
7
8
<%= form_for model, url: '#', builder: DesignSystem::FormBuilder do |f| %>
  <%= f.rpf_radio_input :berry, value: 'raspberry', modifiers:, **attrs do %>
    <em>Raspberries</em> are my choice
  <% end %>
  <%= f.rpf_radio_input :berry, value: 'gooseberry', modifiers:, **attrs do %>
    <em>Gooseberries</em> are my choice
  <% end %>
<% end %>

Radio Input Component (with content)

Passing in a block of content will render the content inside the label.

<%= form_for @person, url: '#', builder: DesignSystem::FormBuilder do |f| %>
  <%= rpf_radio_input :berry do %>
    <strong>Berry important label</strong>
  <% end %>
<% end %>

produces:

<!-- form opening tag goes here --->
<label class="rpf-input-radio">
 <input id="person_berry" name="person[berry]" type="radio" value="raspberry">
 <strong>Berry important label</strong>
 </label>

This is shown with a model, but also works without. The content given will override the label argument. All the other arguments behave as in the other examples.

Param Description Input

—

—