Output Diary

プログラミング × 読書 のアウトプットを発信しています

【Rails】検索機能をつける

  今日のゴールは、

↓検索機能を作ります!!!!!!!!!!

f:id:kina_kq:20210518164024p:plain

 

 

Step1 index.html.erbの変更


まずviewフォルダを変更していきます!

検索機能を付けたい!と思っているindex.html.erbを開けて、

以下のように記述します。

 

私の場合は

app/views/books/index.html.erbに以下のコードを付け加えます。

 

 <h3>投稿を検索</h3>
<%= form_tag({controller:"books",action:"index"}, method: :get) do %>
<%= text_field_tag :search %>
<%= submit_tag '検索する' %>
<% end %>

 ↑インデントがうまくいかなかったので各自で調整してください。

 

今から1つずつ説明していきます。

2行目にあるこのコードでフォームタグを作っています。

<%= form_tag({controller:"books",action:"index"}, method: :get) do %>

 

<%= form_tag({controller:"コントローラ名",action:"アクション名"}, method: :get) do %>

 

といった感じに記入していきます。

↑のコードを参考にして自分用に書き換えて見てください!

 

<%= text_field_tag :search %>

 

さあこのコードはどんな役割をしているのでしょうか?

このコード抜いて「rails s」をしてみます。

 

f:id:kina_kq:20210518165406p:plain

ああああああ。

なんと入力フォームが消えてしまいました。

 

このコードは入力フォームを実装していたのですね。

再度このコードを入れて、railsアプリを起動してみます。

 

f:id:kina_kq:20210518164024p:plain

 

良かった!現れました!👏

 

<%= submit_tag '検索する' %>

 

最後のこのコードは、「検索」するボタンを実装しています。

 

これで見た目は完成しました!

ただこれで終わってはいけません。

見た目を作っただけですから、、、。

 

Step2 コントローラの変更

 

私の場合はbooksコントローラのindexアクションにコードを付け加えていきます。

 

def index
if params[:search] == nil || ''
@books= Book.all
elsif params[:search] == ''
@books= Book.all
else
#部分検索
@books = Book.where("body LIKE ? ",'%' + params[:search] + '%')
end
end

 

↑またまたインデントうまくいかなかったので各自で調整してみてください。

(なんでうまくいかないんだろう、、)

 

if params[:search] == nil || ''
@books= Book.all

 

この部分ではもし「検索」フォームに何も入力されてなかったら?

全部表示するよーというコードです。

 

elsif params[:search] == ''
@books= Book.all

 

次のブロックでは、

もしもparamsに空文字はいっていたら?

これまた全部表示するよー

というコードです。

 

else
#部分検索
@books = Book.where("body LIKE ? ",'%' + params[:search] + '%')

 

はい!最後のブロックは、

キーワードの一部でも一致したら探してとってきますよー!

といったコードになります。

 

完全一致したものだけを表示させたい場合だと、

 where(カラム名: "検索したい文字列")とかけばOKです。

ただ、完全一致検索はなかなか使わない気もします!

 

部分検索がよく使うのでは?と考えています。

 

といった所で、かんせーい!🌟

f:id:kina_kq:20210518164024p:plain

 

「検索機能」完成したのではないでしょうかー?

といったところで今日は以上ですー!良い一日をー!!!!!!!!!!!

f:id:kina_kq:20210403154231p:plain