rails-tutorial拡張編（userとmicropostの検索機能)

userの検索機能を作るぞ

まずはransackというgemをbundle installする。

次にユーザー検索用のフォームのパーシャルを作成する。

app/views/users/_search_form.html.erb

<%= search_form_for @q do |f| %>
  <%= f.label :name_cont, 'User Search' %>
  <div class="input-group">
    <%= f.text_field :name_cont, placeholder: "Enter username...",
                      class: 'form-control' %>
    <span class="input-group-btn">
     <%= f.submit 'Go', class: "btn btn-primary" %>
    </span>
  </div>
<% end %>

このパーシャルを後ほどuserのindexアクションのviewに埋め込む

次に、usersコントローラのindexアクションの処理を変える。

def index
    if params[:q] && params[:q].reject { |key, value| value.blank? }.present?
      @q = User.ransack(search_params, activated_true: true)
      @title = "Search Result"
    else
      @q = User.ransack(activated_true: true)
      @title = "All users"
    end
    @users = @q.result.paginate(page: params[:page])
  end
~
省略
~
private
    def search_params
      params.require(:q).permit(:name_cont)
    end

params[:q][:name_cont]にユーザーが指定した検索ワードが含まれており、検索ワードの指定がない場合は全アクティブユーザーを取得します。
「モデル名.Ransack(検索条件)」の結果を「result」で取得します。
また、検索なしの時と検索ありの時でタイトルを変更しています。

ということらしい

次に作ったパーシャルを埋め込む

app/views/users/index.html.erb

<% provide(:title, @title) %>
<h1><%= @title %></h1>

<div class="row">
  <div class="search_form">
    <%= render 'users/search_form' %>
  </div>
</div>

<%= will_paginate %>

<% unless @users.empty? %>
  <ul class="users">
    <%= render @users %>
  </ul>
<% else %>
  <p>
    Couldn't find any user.<br>
    Please check username you are looking for.
  </p>
<% end %>

<%= will_paginate %>

最後にcssを整える

app/assets/stylesheets/custom.scss

.search_form {
  overflow: auto;
  margin: 10px;
  float: right;
  .input-group {
    width: 300px;
    .form-control {
      width: 250px;
    }
    .btn {
      width: 50px;
    }
  }
}

これで完成！！！

micropostの検索機能