view_component-form icon indicating copy to clipboard operation
view_component-form copied to clipboard

`label` option for CheckBoxComponent & RadioButtonComponent

Open Spone opened this issue 4 years ago • 2 comments

Instead of writing:

= f.label :admin
= f.check_box :admin

= f.label :civility, value: "mr"
= f.radio_button :civility, "mr"
= f.label :civility, value: "mrs"
= f.radio_button :civility, "mrs"

you could write:

= f.check_box :admin, label: true

= f.radio_button :civility, "mr", label: true
= f.radio_button :civility, "mrs", label: true

Spone avatar Jun 26 '21 13:06 Spone

Or maybe it would be better to do it with a group component...

= f.group :admin
  = f.check_box :admin

But in the case of radio buttons, we want 1 radio button = 1 label (and no <label> in the group, just the label text). How to do that? Use nested groups?

= f.group :civility, label: false
  = f.group :civility, value: "mr"
    = f.radio_button :civility, "mr"
  = f.group :civility, value: "mr"
    = f.radio_button :civility, "mrs"

Spone avatar Jun 26 '21 13:06 Spone

Interesting approach from GOV.UK:

  • https://govuk-form-builder.netlify.app/introduction/labels-captions-hints-and-legends/#radio-buttons-with-a-fully-customised-legend
  • https://govuk-form-builder.netlify.app/form-elements/checkboxes/#generating-a-collection-of-checkboxes

Spone avatar Jul 06 '21 21:07 Spone