📝

Railsでcollection_select, selectを使ってセレクトボックスを作る

2022/01/22に公開

作れるもの。

collection_select

選択ボックスをモデルの情報を元に生成する
以下の例ではBookモデルの各レコードのtitleカラムの値でセレクトボックスを作成可能

= form_with model: @books, method: :get, url: books_path do |f|
  = f.collection_select :book_id, Book.all, :id, :title, options = { include_blank: true, selected: <idの値を動的に指定する> }

各引数とその意味

引数 意味
第一 book_id メソッド名
第二 Book.all Bookモデルのレコード全てを選択肢の情報として提供する
第三 id Bookモデルのカラムであるidをフォームのvalueとして設定する
第四 name Bookモデルのカラムであるtitleをセレクトボックスの選択肢の表示に使用する
第五 options include_black: trueで空欄を許容し、selected: <idの値>でどの要素が選択されているかを動的に指定が可能

https://api.rubyonrails.org/classes/ActionView/Helpers/FormBuilder.html#method-i-collection_select

select

options_for_selectオプションを第二引数で使用することで選択肢を自分で決めてセレクトボックスを生成できる

= form_with model: @books, method: :get, url: books_path do |f|
  = f.select :framwork_id, options_for_select([["Ruby on Rails", 1], ["Express", 2], ["React", 3]], <指定する値>), options = { include_blank: true }

各引数とその意味

f.selectに対する表

引数 意味
第一 メソッド名
第二 指定したい選択肢をoptions_for_selectを使用して用意する
第三 オプション(include_black: trueで空欄を許容する)

options_for_selectに対する表

引数 意味
第一 配列やハッシュなど選択肢として表示したい要素の情報
第二 どの要素が選択されているかを動的に指定が可能

https://api.rubyonrails.org/classes/ActionView/Helpers/FormBuilder.html#method-i-select

まとめ

セレクトボックスを作成するときに、モデルの情報を元に選択肢を作成したいときはcollection_selectを使用し、モデルとは関係ない選択肢を自作するときはselectを使う

Discussion