【52日目】掲示板にタグを設定しよう①！（seedについて、チェックボックスの作成、タグの保存・表示）

掲示板へのtag付け機能の追加

seedを使ってTagを追加しておく

seedとは

seedとは初期データのことで、システムの運用前に初期データとなるマスターデータ（あらかじめ用意するベースとなるデータ）を投入したり、開発段階で動作確認のために初期データを投入したりします。
他にもユーザー登録機能のある場合に、アドミン権限をユーザーにrollカラムをつける形で付与している場合などには、データベースをリセットする場合に備えて初期データとしてユーザー情報を投入する場合があるようです。

seedファイルはdb/seeds.rbにcreateメソッドやrubyスクリプトによって記述します。
データベースに投入するにはrails db:seedをすれば良いです。

seedファイルを使ったTagの初期データ作成

createメソッドでは、配列 []の中にハッシュ{key: 値}形式で複数のデータを同時に作成することができる。

seeds.rb

Tag.create([
  { name: 'Ruby' },
  { name: 'Ruby on Rails4' },
  { name: 'Ruby on Rails5' },
  { name: 'Python2' },
  { name: 'Python3' },
  { name: 'Django2' },
])

seedsファイルが編集できたらデータを投入する。

docker-compose exec web rails db:seed

フォームにチェックボックスを作成

_form.html.erb

<div class="form-group">
  <span>タグ</span>
  <%= f.collection_check_boxes(:tag_ids, Tag.all, :id, :name) do |tag| %>
    <div class="form-check">
      <%= tag.label class: 'form-check-label' do %>
        <%= tag.check_box class: 'form-check-input' %>
        <%= tag.text %>
      <% end %>
    </div>
  <% end %>
</div>

まず、多対多アソシエーションの設定によって、boardオブジェクトにはtag_idsプロパティが、tagオブジェクトにはboard_idsプロパティが追加されている。
ここでは、boardに登録されているtagの数分のチェックボックスを作成することになるため、フォームヘルパーのcollection.check.boxesメソッドを用いる。

collection_check_boxesメソッドの構造確認

collection_check_boxes(第一引数, :第二引数, 第三引数, :第四引数, :第五引数 ) 

第一引数　データを保存するテーブル（フォームヘルパー内の場合省略可能）
第二引数　データを保存するカラム
第三引数　第二引数のカラムに渡してあげるデータのリスト
　　　　　ここで渡したデータの数分のチェックボックスが作成される。
第四引数　チェックボックスのvalueに設定されるプロパティ
第五引数　チェックボックスのラベル名に設定されるプロパティ(text)
=>この第二引数で渡したデータリストの数分、ブロック内が繰り返し実行される。
　 ブロック内にはチェックボックスを生成するHTMLが記述されていて、データの数分のチェックボックスが生成される。

<%= tag.label class: 'form-check-label' do %> # タグラベルでチェックボックスとラベル名を覆う
        <%= tag.check_box class: 'form-check-input' %> # チェックボックス自体
        <%= tag.text %> # 第五引数に指定したラベルが表示される

boards_controllerを修正して、チェックボックスを保存できるようにする

ストロングパラメータに対して、チェックボックスのパラメータ（第四引数）に指定したtag_idsを許可すれば保存できるようになる。
ただし、tag_idsは配列の形で複数渡ってくるので、[]をつけて配列であることを明示する必要がある。

boards_controller.rb

def board_params
  params.require(:board).permit(:name, :title, :body, tag_ids: [])
end

掲示板詳細画面で関連づけられたタグを表示する

_detail.html.erb

<% @board.tags.each do |tag| %>
  <span class="badge badge-primary"><%= tag.name %></span>
<% end %>

アソシエーションにおいては、「親モデル.」で、アソシエーション先の子モデルにアクセスできます。
つまり1行目はアソシエーションに設定したboard.tagsをループして、タグの数だけタグ名を表示するようにしている。
2行目では、ブートストラップのバッジのデザインを使用して、掲示板のタイトルの下に表示するようにしている。