collection_radio_buttonsでラベルとラジオボタンのクラスを指定したい

実現したいこと

モデルの要素をラジオボタンで選択するフォームを作っています。
collection_radio_buttonsを使ってみようと思ったんですが、うまくいきません。

発生している問題・分からないこと

生成したラジオボタンについて、画面の見た目はイメージ通りなんですがなぜかクリックができません。
原因がわからず困っています。
また、いろいろ調べてはいますが、うまくできていない状況です。

該当のソースコード

ruby
1<%= f.collection_radio_buttons :contract_type, ContractType.all, :id, :name do |b| %>
2<%= b.label(class: "custom-control-label") { b.radio_button(class: "custom-control-input") + b.text } %>
3<% end %>

試したこと・調べたこと

teratailやGoogle等で検索した
ソースコードを自分なりに変更した
知人に聞いた
その他

上記の詳細・結果

下記のようにしてみたが同じようにクリックできないラジオボタンができて、ダメでした。

ruby
1<%= f.collection_radio_buttons :contract_type, ContractType.all, :id, :name do |b| %>
2<%= b.label(class: "custom-control-label") %>
3<%= b.radio_button(class: "custom-control-input") + b.text } %>
4<% end %>

以下のようにシンプルな形で実装したら、クリックできるラジオボタンができたので、フォームヘルパーの書き方が原因ではと思ってます

ruby
1<%= f.collection_radio_buttons :contract_type, ContractType.all, :id, :name %>

補足

CSSを確認したところ、下記のように擬似クラスでinputが囲まれてしまっていました。
これがクリックできない原因と思いますが、どうすればこのように擬似要素に囲まれないようにできるでしょうか？

html
1::before
2<input >ああああ
3::after
4

行動規範の内容に同意します

回答1件

自己解決

<%= f.collection_radio_buttons :contract_type, ContractType.all, :id, :name do |b| %>
<%= b.label(class: "custom-control-label") %>
<%= b.radio_button(class: "custom-control-input") + b.text } %>
<% end %>

これでできました。
NGな方を残してたせいで、label forが違うところを認識したせいで動いてないように見えてました

投稿2024/05/28 14:32

gomes_2222

総合スコア92