はじめに
Rails学習のアウトプット記事です。実装の際は参考サイトも併せてご確認ください。
Ruby on Railsの学習中にて、フォームヘルパー機能を使ってラジオボタンとラベル（キャプション）を実装する際、ラベルとボタンが紐づいておらず、ラベルをクリックしても反応しなかった。
HTMLだとlabelタグでボタン自体を囲ってしまう方法があるそうだが、フォームヘルパーでラベルを生成する場合はfor属性を使ってボタンを指定する必要がある為、その記述方法を書いていく。
開発環境
- Rails 5.2.6
- Ruby 2.6.3
実装
前提条件
- form_withを使用
- 記事内で使用されているモデル・値は以下の通り
| 項目 | 値 |
|---|---|
| モデル名 | Test |
| カラム名 | status |
| カラム型 | Boolean |
生成されるHTML（ラジオボタン部分のみ）
<input type="radio" value="true" name="test[status]" id="test_status_true" />
<label for="test_status_true">Status true</label>
<input type="radio" value="false" name="test[status]" id="test_status_false" />
<label for="test_status_false">Status false</label>
ブラウザ上の表示
実際に書くコード（ラジオボタン部分のみ）
○○.html.erb
<%# f.radio_button :カラム名, 値 %>
<%# f.label :カラム名_値 %>
<%= f.radio_button :status, true %>
<%= f.label :status_true %>
<%= f.radio_button :status, false %>
<%= f.label :status_false %>
ラベルを日本語化したい場合はi18nのlocaleファイルに:カラム名_値部分を追加するか、
<%= f.label :status_false, "表示させたい文字列" %>
で変更可能。
保守性を考慮する場合はi18nで日本語化を行います。Railsのi18n概要はこちら