箱のプログラミング日記。

渋谷の自社開発企業でRails書いてます。

【 f.check_box】チェックボックスをデフォルトでチェックさせたい

f:id:y_hakoiri:20191120232646j:plain

Railsのビューヘルパーって引数の順番とか個数とかいつも忘れやすくてよくつまづく。

今回はチェックボックスにHTML属性のcheckedをつけておき、最初からチェックされている状態を再現します。

checked属性とは

checked属性を指定すると、あらかじめその選択肢が選択された状態になります。 HTMLでは単にcheckedと記述することもできますが、 XHTMLの場合には、checked="checked"と略さずに記述しなければならないので、 できるだけchecked="checked"と記述した方が良いでしょう。

引用: <INPUT type="checkbox">-HTMLタグリファレンス

f.check_boxにchecked属性を追加

checked="checked"じゃなくてchecked=trueでもいける、みたいな記事を見たことがあるので今回はこちらで。(実際Railsの中で使おうと思ったら真偽値の方が使いやすいかも)

schema.rb

create_table "users", force: :cascade do |t|
    t.string "name", null: false
    t.string "email", null: false
    t.string "password_digest", null: false
    t.boolean "mail_magazine", null: false
    t.datetime "created_at", null: false
end

ユーザーモデルにboolean型のカラムmail_magazineを用意。

できるだけメルマガ送りたいので初めから「メルマガ配信」にチェック入れておきたいけど、まあ外すこともできますよ、ということで新規登録画面にチェックボックスを用意する。

普通に書くとこう

_form.html.slim

= bootstrap_form_for @user do |f|
 = f.form_group :mail_magazine
  = f.check_box :mail_magazine

checked属性を追加

= bootstrap_form_for @user do |f|
 = f.form_group :mail_magazine
  = f.check_box :mail_magazine, checked: true

無論、@userが既にDBに保存されたオブジェクトであれば、現在のオブジェクトの値を参照してtrueならチェックを入れてくれてるはずだけど。(editアクションとか)

ちょっと応用

例えばtrueが入るところに直接trueを入れず、「true(もしくはfalse)が返る何か」を書くこともできる。

真偽値を返すメソッドを使う

_form.html.slim

= bootstrap_form_for @user do |f|
 = f.form_group :mail_magazine
  = f.check_box :mail_magazine, checked: @user.new_record?

@user.new_record?は真偽値を返すので、@userが新しいレコードの場合のみチェックが入る。

「真偽値を返すメソッド」というとboolean型のカラムも同様なので、例えば他モデルのboolean型のカラムの値によって区別したい時も使えそう。

メソッドをヘルパーに切り分ける

_form.html.slim

= bootstrap_form_for @user do |f|
 = f.form_group :mail_magazine
  = f.check_box :mail_magazine, checked: approved_user?(@user)

helpers/form_helper.rb

def approved_user?(user)
 return true if user.status == 'approved'
end

ステータスがapproved(承認済み)のユーザーだった場合はメルマガ配信をする、というちょっと悪どい仕様wもちろん実際は存在しません。笑

余談だけど、真偽値を返すメソッドを定義する時はメソッド名を「?」で終わらせてあげると明示的。

まとめ

  • チェックボックスをデフォルトでチェックさせたい時はchecked属性を使う
  • checked属性の値はcheckedもしくは真偽値
  • Railsのメソッドで真偽値を返せば出し分けがしやすく便利

参考

f.check_box・check_box_tag、 f.radio_button・radio_button_tagのchecked|DIGITAL SQUADブログ

<INPUT type="checkbox">-HTMLタグリファレンス