投稿された本の詳細画面、投稿編集機能、投稿削除機能実装

投稿された本の詳細画面を作成

投稿された本の詳細画面を作成していく。作成するビューはbooks/show.html.erbになる。

コントローラの作成

まずはbooksコントローラのshowアクションを定義していく。

app/controllers/books_controller.rb

  def show
    @book = Book.find(params[:id])
    @user = @book.user
    @new_book = Book.new
  end
ビューの作成

サイドバーの本の投稿部分は、以前に作成した部分をコピー&ペーストする。(最終的に部分テンプレート化する)

app/views/books/show.html.erb

#本の投稿機能
<h2>New book</h2>
<%= form_with model: @new_book do |f| %>
  <div>
    <%= f.label :title %>
    <%= f.text_field :title %>
  </div>
  <div>
    <%= f.label :opinion %>
    <%= f.text_area :body %>
  </div>
  <div>
    <%= f.submit 'Create Book' %>
  </div>
<% end %>
#本の詳細画面
<div>
  <h2>Book detail</h2>
  <table>
    <tbody>
      <tr>
        <td>
          <%= link_to user_path(@user) do %>
            <%= image_tag @user.get_profile_image(80,80) %><br>
            <%= @user.name %>
          <% end %>
        </td>
        <td>
          <%= link_to book_path(@book) do %>
            <%= @book.title %>
          <% end %>
        </td>
        <td>
          <%= @book.body %>
        </td>
      </tr>
    </tbody>
  </table>
</div>

詳細画面に編集リンク、削除ボタンの作成

上記で作成した本の詳細画面に自分の投稿の場合、編集リンクボタンと削除ボタンを実装する。

まずは、booksコントローラに削除機能のdestroyアクションを定義する。

app/controllers/books_controller.rb

  def destroy
    book = Book.find(params[:id])
    book.destroy
    redirect_to books_path
  end

自分の投稿以外は非表示にするため、if文を使いbooks/show.html.erbに記述を追加する。

app/views/books/show.html.erb

(省略)
        <% if @user == current_user %>
          <td>
            <%= link_to "Edit", edit_book_path(@book)%>
          </td>
          <td>
            <%= link_to "Destroy", book_path(@book), method: :delete %>
          </td>
        <% end %>
(省略)

上記の記述をtable内に追加記述する。

記述が完了したら、サーバーを立ち上げ、編集リンクの遷移先が問題ないか、削除ボタンが正常に動作するかを確認する。

投稿編集機能の作成

編集画面を作成したので、編集画面を作成していく。

まずは、booksコントローラにeditアクション、updateアクションを定義していく。

app/controllers/books_controller.rb

  def edit
    @book = Book.find(params[:id])
  end

  def update
    @book = Book.find(params[:id])
    @book.update(book_params)
    redirect_to book_path(@book.id)
  end

次に、ビューを作成する。(編集画面にはサイドバーはないため、新規投稿機能は必要ない。)

app/views/books/edit

<div>
  <div>
    <div>
      <h1>Editing Book</h1>
      <%= form_with model: @book, mothod: :patch do |f| %>
        <div>
          <%= f.label :title %>
          <%= f.text_field :title %>
        </div>
        <div>
          <%= f.label :opinion %>
          <%= f.text_area :body %>
        </div>
        <div>
          <%= f.submit "Update Book" %>
        </div>
      <% end %>

      <%= link_to "Show", book_path(@book) %>
      |
      <%= link_to "Back", books_path %>
    </div>
  </div>
</div>

これで編集機能の実装が完了した。

確認のため、サーバー上で編集機能が問題ないか。showリンク、backリンクの遷移先が問題ないか確認する。

以上。

アプリケーションの作成 参考URL  作成するアプリケーションについて - takifugu’s blog