見出し画像

備忘録15:Rails-ransack導入

転職のための3月6日から某スクールにでプログラミング学習を始めた32歳のおっさんです。時系列でHTML⇨CSS⇨Rails & JavaScript &SQLを学習中。
最近C#とPHPにも興味が湧いてきた。


1:開幕の自問自答

①検索システムって毎回作るの面倒じゃない?
 ⇨そうですね。
②Gemとかないの?
 ⇨あります。
③はよ教えてっ!
 ⇨しょうがにゃいにゃあ…

と、言うわけで今回は検索Gemのransackについてです。
検索機能を付けるのに大変便利です。
実装するのは以下3つです。
①キーワード検索 ②選択肢を選んで検索 ③絞り込み検索



2:環境

①OS:Mac BigSur
①Rails:6.0.0



3:全体の流れ

①ransackの導入とルーティング
②コントローラーの編集
③検索フォームの編集
④検索結果の表示



4:ransackの導入とルーティング

スクリーンショット 2021-06-28 20.38.46

スクリーンショット 2021-06-28 20.39.22



5:コントローラーの編集

スクリーンショット 2021-06-28 20.53.10

スクリーンショット 2021-06-28 20.59.34

まずはコントローラーにこの様な記述を行う。
それぞれの役割は以下。

①:[:q]を使い、テーブルから情報を得ている。それを@bに格納している。
  [:q]がなんなのかというと、多分ransack使うときに必要なやつ。

②:①で作った@bにresultを付けることで検索結果を取得している。
  そしてそれを@result_bazaarに格納している。

③:大抵、トップページには多少の新情報があるので入れておく。
  トップページに何も無くて良いなら、無くて良い。

④:大抵、検索機能はトップページにもある。
  そして、検索結果のページからも検索が出来る。
  なので、「:index と :search」でbefore_actionしている。



6:検索フォームの編集

スクリーンショット 2021-06-28 21.10.12

この様に記述する。
各①〜③に対する補足説明は以下の感じ。


①キーワード検索について

ポイントは「:title_contf.search_field に入力されたキーワードが titleカラム に含まれているレコードを取得する。
つまり、以下の例ならレコードを取得できる。

例:レコードのtitle → 神戸牛
例:検索するキーワード → 牛
キーワード検索はとても解り易い。
特にこれ以上書くこともない。



②選択肢を選ぶタイプの検索について

f.collection_select :カラム名_eq, 配列, DBのカラム名, :表示するカラム名, include_blank: '指定なし'

第一引数:テーブル上のカラム名を指定する
第二引数:配列データを指定する
第三引数:参照するDBのカラム名
第四引数:実際に表示するカラム名
第五引数:オプション
今回はActiveHashを選択肢として実装している。
配列データはcontrollerでインスタンス変数にして、ここで渡しても良い。
が、そうすると何故かエラーが発生することもあるので個人的には直接ここに書いてしまう方がおすすめ。

今回はActiveHashから参照しているので第三引数と第四引数が違う。
これが普通のテーブル参照なら同じになる。
collection_selectでプルダウン式の選択肢にする。

要はこういうの。

スクリーンショット 2021-06-28 21.23.05



③範囲検索について

ポイントは gteqlteg
f.search_field :カラム名_gteq
f.search_field :カラム名_lteq

カラム名_qtegは 入力された数値以上
カラム名_lteqは 入力された数値以下

これにより、下限と上限が設定される。
こちらはキーワード検索とほぼ同じ。
gteq と lteqによって上限と下限を指定している。
もちろん、片方だけ入力して検索することも出来る。



7:検索結果の表示

スクリーンショット 2021-06-28 21.41.55

ここはもう普通にeach処理で結果を表示してしまえばOK。
強いて言えば、取得したレコードの有無で条件分岐しているくらい。(黄枠)

余談ですが、この検索結果は部分テンプレートとして表示してます。
searchアクションに対応した「search.html.erb」に
検索欄と検索結果をそれぞれ部分テンプレートで埋め込んでる感じ。


こういう感じですね。

スクリーンショット 2021-06-28 21.47.04




10:終わりに

今回のransackはとてつもなく便利なGemです。
多分、現場でも物凄く使われているんじゃあないかなぁと想像してます。
使い勝手がとても良いです。
キーワード検索の作り方を調べるのに少しかかったくらいです。
ので、役立てて頂ければ幸いです。

次回はform_withオプションのlocal: true辺りについて書きます。
こいつをよく理解してないおかげでえらい遠回りしました。
詰まってはいませんでしたが、4時間くらい要らん作業してました。
よく理解もせずにオプションを書いてはいけない(戒め





終わり!!!!!!!!!!!!!!!!!

この記事が気に入ったらサポートをしてみませんか?