Railsアプリでの検索フォームの作り方 - プログラミング学習ノート

f:id:endoakak:20200727195612j:plain

投稿を検索する機能の作り方です。

こういうやつですね。

f:id:endoakak:20200827193902p:plain:w200

ルーティングを設定

まずはルーティングを設定します。

resourcesの７種類には含まれないアクションを作るので、collectionを使います。config/routes.rbに以下のように記述します。

Rails.application.routes.draw do
  略
  resources :posts do
    collection do
      get "search"
    end
  end
end

これで、postsコントローラーのsearchアクションへのルーティングが設定できました。

f:id:endoakak:20200827190134p:plain

rails routesで調べてみると、search_postsという名前がついています。

ビューに検索フォームを作成

パスが作成できたので、ビューファイルにフォームを作ります。

<%= form_with url: search_posts_path, local: true, method: :get, class: "search-form" do |f| %>
  <%= f.text_field :keyword, placeholder: "投稿を検索する", class: "search-input" %>
  <%= f.submit "検索", class: "search-btn" %>
<% end %>

検索するワードには、:keywordという名前をつけておきました。

form_withはデフォルトではAjax通信を行うので、local: trueの記述でAjaxを無効にする必要があります。そして、HTTPメソッドはgetに変更しておきます。

コントローラーにsearchアクションを作成

入力されたキーワードで検索した投稿を受け取るため、app/controllers/posts_controller.rbでsearchアクションを定義します。

@posts = Post.search(params[:keyword])

しかしsearchというメソッドは存在しないので、自分で定義する必要があります。

モデルでsearchメソッドを定義

入力されたキーワードを含む投稿をデータベースから検索するメソッドを、モデルで定義します。データベースに関するメソッドはモデルで定義する、という意識が重要です。

class Post < ApplicationRecord
  def self.search(keyword)
    if keyword != ""
      Post.where('text LIKE(?)', "%#{keyword}%")
    else
      Post.all
    end
  end
end