【rails6】ransack을 이용한 복잡한 검색 정리 ~ 좁은 검색 ~

안녕하세요!
요전날의 계속, 「ransack를 이용한 복잡한 검색」에 대한 계속의 투고가 됩니다.
지난번에는 「폼에 입력해 검색을 실행한다」라고 했습니다만 오늘은 좀 더 복잡한 검색을 구현합니다.

그렇다면 오늘 해보는 것을 먼저보십시오.


... 일단 해설해 둡니다.
이미 "여성"카테고리로 나누어진 중에서
가격이 2,000엔 이하로 한층 더 조리개를 걸고 있습니다.

그럼 구현하겠습니다.

환경

지난번처럼
htps : // 코 m / 타카히로_이토 / ms / 아 4 아 7042 b3 51561521b
여기를 확인하십시오.

① 뷰에 추가 검색 양식을 작성합니다.

컨트롤러는 마지막으로 작성되었으므로 갑자기 뷰에서 작성됩니다.

items/search.html.erb

<div class="search-bar">
  <%= search_form_for @q, url: items_search_path do |f| %>
    <div class="nav-title">詳細検索</div>
      <ul>
      <li class="search-nav-content">
        <p><%= f.label "カテゴリーを選択する" %></p>
        <%= f.collection_select :category_id_eq, Category.where.not(id: 0), :id, :name, include_blank: "カテゴリーの選択", class:"search-select-box"  %>
      </li>
      <li class="search-nav-content">
        <p><%= f.label "商品の状態" %></p>
        <%= f.collection_select :status_id_eq, Status.where.not(id: 0), :id, :name, include_blank: "商品の状態の選択"  %>
      </li>
      <li class="search-nav-content">
        <p><%= f.label "価格" %></p>
        <%= f.number_field :price_gteq, class:"input-price", placeholder: "¥Min" %> 〜
        <%= f.number_field :price_lt, class:"input-price", placeholder: "¥Max" %>
      </li>
      <li class="search-nav-content">
        <p><%= f.label "配送費" %></p>
        <%= f.collection_select :shippingfee_id_eq, Shippingfee.where.not(id: 0), :id, :name, include_blank: "配送費の選択"  %>
      </li>
      <%= f.submit '検索する' %>
      </ul>
    <% end %>
  </div>

이것이 완성형의 보기입니다.

첫째,

<%= search_form_for @q, url: items_search_path do |f| %>

여기는 이전과 같습니다. 곧 이해할 수 있다고 생각합니다.
검색결과는 같은 페이지에 표시하도록 지시합니다.

이하, 파트마다 해설을 해 가네요.

선택 상자를 만들고 싶습니다.

이 양식에 존재하는 "선택 상자"는 다음과 같이 만듭니다.

<%= f.collection_select :category_id_eq, Category.where.not(id: 0), :id, :name, include_blank: "カテゴリーの選択", class:"search-select-box"  %>

아래와 같이 이해하면 알기 쉽다고 생각합니다.

:category_id_eq.               => category_idと一致するものを探したい（eqの為完全一致です）
Category.where.not(id: 0)      => Categoryからidが0以外のもの全てから選びたい（今回はActivehashを使用しています。）
:id                            => 結果はidを返します
:name                          => Categoryのnameを画面に表示してください
include_blank: "カテゴリーの選択"  => 初期表示は"カテゴリーの選択"と表示してください

○○이상 △△미만의 좁히기를 하고 싶다

그럼 금액을 좁혀 갑시다.
이번에는 "양식에 원하는 금액을 입력할 수 있도록 한다"라는 것입니다.

아래와 같이 기술합시다.

<%= f.number_field :price_gteq, class:"input-price", placeholder: "¥Min" %>
<%= f.number_field :price_lt, class:"input-price", placeholder: "¥Max" %>

방금전처럼 분해해 갑니다.

:price_gteq  => praiceについて入力値 以上 (grater than or equalの略）
:price_lt    => praiceについて入力値 未満 (less thanの略）

이것으로 구현이 가능했습니다.

이번은 이상입니다.
앞으로는 체크 박스와 라디오 버튼의 구현도 해 나갈 것입니다.

그럼 다시 만나요! !