heartcombo / simple_form

Forms made easy for Rails! It's tied to a simple DSL, with no opinion on markup.
http://blog.plataformatec.com.br/tag/simple_form
MIT License
8.21k stars 1.31k forks source link

Can I disable the hidden input from radio buttons? #1728

Closed aximuseng closed 3 years ago

aximuseng commented 3 years ago

Environment

I am trying to build a radio button collection in a nested form. If this was a one off I would just hard code etc. but given I have multiple nested form elements SF should make this easy.

I am trying to make something like this

*() Label 1 Text** Hint 1 Text

( ) Label 2 Text Hint 2 Text

( ) Label 3 Text Hint 3 Text

I have three separate radio like this:

i.input :my_field, value: 'value_1', wrapper: :radio_grouped_list, item_label_class: 'font-bold', as: :radio_buttons, hint: 'Hint 1 Text', collection: [['Label 1 Text','value_1']]

The custom wrapper I made handles all the CSS. The issue is that I now realize that SF inserts a blank value = nil hidden field before each radio. Unless I select the last radio the form always passes a blank value.

If I make one input and expand the collection I can then only display one hint:

() Label 1 Text () Label 2 Text *() Label 3 Text** Hint Text

I don't see it but any way to disable the hidden field (I can add my own manually)

carlosantoniodasilva commented 3 years ago

There should be no hidden field with each radio button, but Rails does add one by default with a blank value to the collection so that something gets submitted to the server if no radio is selected, as explained in the "Gotcha" section of the docs here: https://api.rubyonrails.org/classes/ActionView/Helpers/FormOptionsHelper.html#method-i-collection_radio_buttons. (note that the collection_radio_buttons helper exists in Rails now, it was extracted from SF and it now only wraps its functionality.) It should be possible to disable that hidden field by passing include_hidden: false.

Here's my test using the same input you shared (except for the wrapper option, and adding 3 items to the collection):

<%= f.input :my_field, value: 'value_1', item_label_class: 'font-bold', as: :radio_buttons, hint: 'Hint 1 Text',
  collection: [['Label 1 Text','value_1'], ['Label 2 Text', 'value_2'], ['Label 3 Text', 'value_3']] %>
<div class="input radio_buttons optional post_my_field field_with_hint">
  <label class="radio_buttons optional">My field</label>
  <input type="hidden" name="post[my_field]" value="" />
  <span class="radio">
    <label class="font-bold" for="post_my_field_value_1">
      <input
        class="radio_buttons optional"
        type="radio"
        value="value_1"
        name="post[my_field]"
        id="post_my_field_value_1"
      />Label 1 Text</label
    >
  </span>
  <span class="radio">
    <label class="font-bold" for="post_my_field_value_2">
      <input
        class="radio_buttons optional"
        type="radio"
        value="value_2"
        name="post[my_field]"
        id="post_my_field_value_2"
      />Label 2 Text</label
    >
  </span>
  <span class="radio">
    <label class="font-bold" for="post_my_field_value_3">
      <input
        class="radio_buttons optional"
        type="radio"
        value="value_3"
        name="post[my_field]"
        id="post_my_field_value_3"
      />Label 3 Text</label
    >
  </span>
  <span class="hint">Hint 1 Text</span>
</div>

If that doesn't resolve it for you, can you please share the entire markup that's being generated?

aximuseng commented 3 years ago

The include_hidden: was what I was looking for. Is that documented in the Wiki somewhere?

carlosantoniodasilva commented 3 years ago

Cool, I'm glad that it worked.

I don't believe it is in the wiki, because this is technically a feature provided by Rails form helpers, it's documented in their API. Simple Form is passing those options down to Rails directly.

I did find a brief mention of it in the Readme, I tried to improve it a bit https://github.com/heartcombo/simple_form/commit/2fa860e5f607da307570df75cf57b3684f82e23c.

aximuseng commented 3 years ago

Awesome - the API is right: In the rare case you don't want this hidden field... 🤣