🦁

【Rails】簡単な掲示板機能②

2023/11/19に公開

Rails

初学者

dmmwebcamp

tech

簡単な掲示板機能①の続きになります。①では手順の1～2まででしたが本記事では3～4の会員側のページ作成について行います。

前提条件

ルーティング・モデル作成済み
管理者側にてコミュニティ作成済み

会員側のページにコミュニティ一覧を作成する

管理者側で作成されたコミュニティを選んで投稿できるように一覧を作成します。

コントローラ記述

admin側同様、public側にもコミュニティのコントローラを作成し記述する。

public/communities_controller

class Public::CommunitiesController < ApplicationController
  def index
    @communities = Community.all
  end
end

ビュー記述

public/views/communities/index.html.erb

<div class="container">
  <div class='row mt-5'>
      <h3>コミュニティ一覧</h3>
      
      <table class="table mt-3">
        <tr>
          <th class="col-4">コミュニティ名</th>
          <th>説明</th>
          <th></th>
        </tr>
      <% @communities.each do |community| %>
        <tr>
          <td class="col-4"><%= community.name %></td>
          <td><%= community.explanation %></td>
          <td><%= link_to "掲示板へ", community_post_boards_path(community) %></td>
        </tr>
      <% end %>
      </table>
  </div>
</div>

完成形

掲示板へのリンクをクリックすると各コミュニティごとの投稿フォームと一覧のあるページに飛べます。

コミュニティごとの投稿一覧

コミュニティと投稿の紐づけが必要になる一番重要な箇所になります。僕はここら辺の記述が曖昧で苦労しました。

投稿用のコントローラ記述

class Public::PostBoardsController < ApplicationController
  def index
    @community = Community.find(params[:community_id])
    @post_board = PostBoard.new
    @post_boards = @community.post_boards
    @users = User.all
  end
  
  def create
    @community = Community.find(params[:community_id]) # 選択したコミュニティを取得
    @post_boards = @community.post_boards
    @post_board = @community.post_boards.build(post_board_params) # コミュニティに紐づく投稿を作成し、パラメータを設定
    @post_board.user_id = current_user.id 
    if @post_board.save
      flash[:notice] = "登録に成功しました。"
      redirect_to community_post_boards_path(@community)
    else
      flash.now[:alert] = "登録に失敗しました"
      render :index
    end
  end
  
  def destroy
    @post_board = PostBoard.find(params[:id]) # 削除する投稿を取得
    if @post_board.user_id == current_user.id # ログインユーザーと投稿のユーザーが一致しているかチェック
      @post_board.destroy # 投稿を削除
    end
    flash[:notice] = "削除に成功しました。"
    redirect_to community_post_boards_path(params[:community_id]) # コミュニティの投稿一覧ページにリダイレクト
  end
  
  private

  def post_board_params
    params.require(:post_board).permit(:user_id, :community_id, :body) # 投稿のパラメータのみを許可する
  end
  
  
end

indexでは、params[:community_id]を使用して、Communityモデルからコミュニティを取得し、PostBoardオブジェクトを作成しています。また、@post_boards変数には、@communityに紐づく投稿をすべて格納しています。
createでは、上記の内容に加え、@post_board変数には、post_board_paramsを使用して、@communityに紐づく投稿を作成しています。

buildメソッドとは

Railsのアソシエーションを使用して、関連するオブジェクトを作成するためのメソッドです。@community.post_boards.buildのように使用することができます。この場合、@communityに紐づくPostBoardオブジェクトを作成し、@post_board変数に代入しています。

ビューの記述

こちらのビューでは、投稿フォームと投稿一覧を作成します。

views/public/post_boards/index.html.erb

<div class="container mt-5">
  <h4><%= @community.name %>への投稿はこちら！</h4>
  
  <%= form_with(model:@post_board,url: community_post_boards_path(@community), local: true) do |form| %>
    <%= form.hidden_field :community_id,value: @community.id %>
    <%= form.hidden_field :user_id, value: current_user.id %>
    <%= form.text_area :body, size: "3x3", class: 'form-control' %>
    <%= form.submit "投稿", class:"btn btn-success mt-2" %>
  <% end %>

  <h3 class="mt-5 mb-3 text-center"><%= @community.name %>の投稿一覧</h3>
  
  <% @post_boards.each do |post_board| %>
    <% if post_board.id != nil %>
    <div class="card">
      <div class="card-header">
        <div class="row">
          <p class="col-2"><%= post_board.user.name %>より：</p>
          <p class="col-5"><%= post_board.created_at.strftime("%Y年%m月%d日 %H時%M分") %></p>
        </div>
      </div>
    </div>
      <ul class="list-group list-group-flush">
        <li class="list-group-item"><%= post_board.body %></li>
        <li class="list-group-item">
        <% if current_user.id == post_board.user_id %> <!-- ログインユーザーが投稿のユーザーと一致しているかチェック -->
          <%= link_to "削除", community_post_board_path(post_board.community_id, post_board), method: :delete, class:"btn btn-danger" %> <!-- 削除リクエストを送るためのリンクを作成 -->
        <% end %>
        </li>
      </ul>
    <% end %>
  <% end %>

</div>

<% if current_user.id == post_board.user_id %>で、ログインユーザーが投稿のユーザーと一致している場合にのみ、削除ボタンが表示されるようにしてあります。

完成形

以上！次回は不適切な掲示板投稿を管理者側で削除する機能の作成になります。