rails-tutorial拡張編(userとmicropostの検索機能)
3634 ワード
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の検索機能
Author And Source
この問題について(rails-tutorial拡張編(userとmicropostの検索機能)), 我々は、より多くの情報をここで見つけました https://qiita.com/yd43star/items/29615e5cfed6a4d3c120著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .