0
Ich habe eine Liste von Büchern. Es gibt Filter oben auf der Liste für die Suche und Ihre Standardsortierung Dropdown. Dann sind auf der Seite Checkbox-Filter (siehe Bild unten). der Dokumentation nach, nur für die Top-Such- und Sortierfilter auf den ersten
Filterspezifische Such- und Sortierfilter funktionieren nach dem Hinzufügen von Kontrollkästchenfiltern nicht mehr
ich die Filterrific gem Setup. Sie funktionierten hervorragend auf der Listenseite "Alle Bücher", der Buchliste "Serie" und der Buchlistenseite "Sammlungen". Diese werden alle von ihren eigenen Controllern verwaltet, aber alle verwenden das "Titel" -Modell. Ein paar Tage nachdem ich die Top Filter zum Laufen gebracht habe, habe ich die Seitenfilter mit Filterrific arbeiten lassen. Ich habe nur die Seitenfilter auf der Listenseite "Alle Bücher" gemacht. Ich wollte zuerst alles daran arbeiten lassen, bevor ich es auf die anderen Seiten verlagerte.
Nur der erste Satz Seitenfilter funktioniert (Typ), aber jetzt funktionieren die Such- und Sortierfilter nicht mehr wie erwartet. Wenn ich die Sortierreihenfolge ändere passiert nichts. Nehmen wir an, ich ändere es, um die Titel von Z bis A aufzulisten. Die Liste ändert sich nicht. Wenn ich einen der Seitenfilter ankreuze, ändert sich die Liste entsprechend dem Seitenfilter. ABER, wenn ich den Seitenfilter deaktiviere, ändert sich die Liste entsprechend der Sortier-Dropdown-Option, die ich vor dem Ankreuzen des Seitenfilters gewählt hatte. Wenn Sie den Sortierfilter erneut ändern, wird nichts ausgeführt. Es funktioniert nur, nachdem ich einen Seitenfilter angekreuzt habe. Der Suchfilter funktioniert überhaupt nicht mehr.
My "Titel" Modell:
class Title < ActiveRecord::Base
# Tenant Of
belongs_to :account, :inverse_of => :titles
accepts_nested_attributes_for :account
default_scope { where(account_id: Account.current_id) }
belongs_to :writer, :inverse_of => :titles
accepts_nested_attributes_for :writer
mount_uploader :cover, CoverUploader
mount_uploader :cover2, Cover2Uploader
mount_uploader :cover3, Cover3Uploader
def to_param
"#{id}-#{title.parameterize}"
end
filterrific(
default_filter_params: { sorted_by: 'published_desc' },
available_filters: [
:sorted_by,
:search_query,
:with_btype,
:with_bformat,
:with_age,
:with_series,
:with_collection,
:with_guide
]
)
# default for will_paginate
self.per_page = 10
# Search by Author or Title
scope :search_query, lambda { |query|
return nil if query.blank?
terms = query.downcase.split(/\s+/)
terms = terms.map { |e|
(e.gsub('*', '%') + '%').gsub(/%+/, '%')
}
num_or_conds = 2
where(
terms.map { |term|
"(LOWER(titles.title) LIKE ? OR LOWER(titles.name) LIKE ?)"
}.join(' AND '),
*terms.map { |e| [e] * num_or_conds }.flatten
)
}
# Sort By All These Options
scope :sorted_by, lambda { |sort_option|
# extract the sort direction from the param value.
direction = (sort_option =~ /desc$/) ? 'desc' : 'asc'
case sort_option.to_s
when /^title_/
order("LOWER(titles.title) #{ direction }")
when /^price_/
order("titles.price #{ direction }")
when /^author_/
order("LOWER(titles.name) #{ direction }")
when /^published_/
order("titles.published #{ direction }")
else
raise(ArgumentError, "Invalid sort option: #{ sort_option.inspect }")
end
}
def self.options_for_sorted_by
[
['Title - A to Z', 'title_asc'],
['Title - Z to A', 'title_desc'],
['Price - Low to High', 'price_asc'],
['Price - High to Low', 'price_desc'],
['Author - A to Z', 'name_asc'],
['Author - Z to A', 'name_desc'],
['Newest to Oldest', 'published_desc'],
['Oldest to Newest', 'published_asc']
]
end
#checkbox Side Filters
# Book Types
scope :with_btype, lambda { |flag|
where(btype:[flag])
}
# Book Formats
scope :with_bformat, lambda { |flag|
where(bformat:[flag])
}
# Age Groups
scope :with_age, lambda { |flag|
where(age:[flag])
}
# Book Series
scope :with_series, lambda { |flag|
where(sname:[flag])
}
# Book Collections
scope :with_collection, lambda { |flag|
where(cname:[flag])
}
# Guides
scope :with_guide, lambda { |flag|
where(gname:[flag])
}
end
Meine "Bücher" Controller:
class BooksController < ApplicationController
skip_before_filter :require_login
skip_before_filter :not_authenticated
before_action :set_title, only: [:show]
layout "unify"
def index
@filterrific = initialize_filterrific(
Title,
params[:filterrific],
select_options: {
sorted_by: Title.options_for_sorted_by
},
:persistence_id => false,
) or return
@titles = @filterrific.find.unscope(where: :account_id).paginate(:page => params[:page])
respond_to do |format|
format.html
format.js
end
rescue ActiveRecord::RecordNotFound => e
puts "Had to reset filterrific params: #{ e.message }"
redirect_to(reset_filterrific_url(format: :html)) and return
end
def show
end
private
def set_title
@title = Title.unscope(where: :account_id).find(params[:id])
end
def title_params
params.require(:title).permit(:cover, :cover2, :cover3, :title, :name, :btype, :genre, :price, :bformat, :pages, :edition, :age, :series, :sname, :collection, :cname, :guide, :gname, :movie, :mname, :isbn, :isbn13, :published, :description, :audio, :audio_html, :video, :video_html, :quote, :barns_noble, :amazon_us, :alibris, :abebooks, :books_million, :amazon_uk, :writer_id, :account_id, :active)
end
end
Mein "Bücher Index" Ansicht:
<!--=== Breadcrumbs v4 ===-->
<div class="breadcrumbs-v4">
<div class="container">
<ul class="breadcrumb-v4-in">
<li><a href="/">Home</a></li>
<li class="active">All Books</li>
</ul>
</div><!--/end container-->
</div>
<!--=== End Breadcrumbs v4 ===-->
<!--=== Content Part ===-->
<div class="content container">
<div class="row">
<div class="col-md-3 filter-by-block md-margin-bottom-60">
<h1>Filter By</h1>
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
Type
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<%= form_for_filterrific @filterrific do |f| %>
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_btype, {multiple: true}, 'Childrens', nil) %>
<i></i>
Children's
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_btype, {multiple: true}, 'Young Adult', nil) %>
<i></i>
Young Adult
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_btype, {multiple: true}, 'Fiction', nil) %>
<i></i>
Fiction
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_btype, {multiple: true}, 'Non-Fiction', nil) %>
<i></i>
Non-Fiction
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<div class="panel-group" id="accordion-v3">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion-v3" href="#collapseThree">
Format
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<div id="collapseThree" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_bformat, {multiple: true}, 'Hardcover', nil) %>
<i></i>
Hardcover
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_bformat, {multiple: true}, 'Paperback', nil) %>
<i></i>
Paperback
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_bformat, {multiple: true}, 'Audiobook CD', nil) %>
<i></i>
Audiobook CD
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_bformat, {multiple: true}, 'E-book', nil) %>
<i></i>
E-book
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<div class="panel-group" id="accordion-v3">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion-v3" href="#collapseThree">
Age
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<div id="collapseThree" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_age, {multiple: true}, '0 - 3', nil) %>
<i></i>
0 - 3
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_age, {multiple: true}, '4 - 6', nil) %>
<i></i>
4 - 6
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_age, {multiple: true}, '7 - 9', nil) %>
<i></i>
7 - 9
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_age, {multiple: true}, '10 - 12', nil) %>
<i></i>
10 - 12
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_age, {multiple: true}, '13 And Up', nil) %>
<i></i>
13 And Up
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<div class="panel-group" id="accordion-v3">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion-v3" href="#collapseThree">
Series
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<div id="collapseThree" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_series, {multiple: true}, 'The Mysterious Mrs. Bean', nil) %>
<i></i>
The Mysterious Mrs. Bean
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<div class="panel-group" id="accordion-v3">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion-v3" href="#collapseThree">
Collections
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<div id="collapseThree" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_collection, {multiple: true}, 'Classic Noir', nil) %>
<i></i>
Classic Noir
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_collection, {multiple: true}, 'True Crime', nil) %>
<i></i>
True Crime
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_collection, {multiple: true}, 'Lesbian', nil) %>
<i></i>
Lesbian
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<div class="panel-group" id="accordion-v3">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion-v3" href="#collapseThree">
Guides
<i class="fa fa-angle-down"></i>
</a>
</h2>
</div>
<div id="collapseThree" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="list-unstyled checkbox-list">
<li>
<label class="checkbox">
<%= f.check_box(:with_guide, {multiple: true}, 'Survival', nil) %>
<i></i>
Survival
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_guide, {multiple: true}, 'Travel', nil) %>
<i></i>
Travel
</label>
</li>
<li>
<label class="checkbox">
<%= f.check_box(:with_guide, {multiple: true}, 'Sexual', nil) %>
<i></i>
Sexual
</label>
</li>
</ul>
</div>
</div>
</div>
</div><!--/end panel group-->
<%= link_to('RESET FILTERS', reset_filterrific_url, :class => 'btn-u btn-brd btn-brd-hover btn-u-lg btn-u-sea-shop btn-block') %>
</div>
<div class="col-md-9">
<div class="row margin-bottom-5">
<div class="col-sm-2 result-category">
<h3>BOOKS</h3>
</div>
<div class="col-sm-10">
<ul class="list-inline clear-both">
<li class="grid-list-icons">
<%= link_to('Reset Filters', reset_filterrific_url, :class => 'btn-u btn-u-sea-shop') %>
</li>
<li class="sort-list-btn">
<h3>Sort :</h3>
<div class="btn-group">
<%= f.select(:sorted_by, @filterrific.select_options[:sorted_by], class: 'btn btn-default dropdown-toggle') %>
</div>
</li>
<li class="sort-list-btn">
<h3>Search :</h3>
<div class="btn-group">
<%= f.text_field(:search_query, class: 'filterrific-periodically-observed') %>
</div>
</li>
</ul>
<%= render_filterrific_spinner %>
<% end %>
</div>
</div><!--/end result category-->
<div id="filterrific_results" class="filter-results">
<%= render(partial: 'books/list', locals: { titles: @titles }) %>
</div><!--/end filter resilts-->
</div>
</div><!--/end row-->
</div><!--/end container-->
<!--=== End Content Part ===-->
Mein "index.js":
<% js = escape_javascript(
render(partial: 'books/list', locals: { titles: @titles })
) %>
$("#filterrific_results").html("<%= js %>");
Meine "Liste" partial:
<% @titles.each do |title| %>
<div class="list-product-description product-description-brd margin-bottom-30">
<div class="row">
<div class="col-sm-4">
<a href="shop-ui-inner.html"><%= image_tag(title.cover_url(:listview), class: "img-responsive sm-margin-bottom-20") if title.cover? %></a>
</div>
<div class="col-sm-8 product-description">
<div class="overflow-h margin-bottom-5">
<ul class="list-inline overflow-h">
<li><h4 class="title-price"><%= link_to book_url(title) do %><%= title.title %><% end %></h4></li>
<li><span class="gender text-uppercase">By <%= title.name %></span></li>
</ul>
<div class="margin-bottom-10">
<span class="title-price margin-right-10"><%= title.btype %> | <%= title.bformat %> | <%= title.age %></span>
</div>
<div class="margin-bottom-10">
<span class="title-price margin-right-10"><%= title.sname %> | <%= title.cname %> | <%= title.gname %></span>
</div>
<div class="margin-bottom-10">
<span class="title-price margin-right-10">$<%= title.price %></span>
</div>
<p class="margin-bottom-20"><%= (raw title.description.truncate(500)) %></p>
<ul class="list-inline add-to-wishlist margin-bottom-20">
</ul>
<%= link_to('Read More ...', book_url(title), :class => 'btn-u btn-u-sea-shop') %>
</div>
</div>
</div>
</div>
<% end %>
<div class="text-center">
<%= will_paginate @titles, renderer: BootstrapPagination::Rails %>
</div><!--/end pagination-->
Ich hatte den Eindruck, alle diese verschiedenen Filter sollte unter einem filterrific Form arbeiten. Ich habe versucht, sie zu trennen, aber das hat auch nicht funktioniert, weil ich nicht wirklich sicher war, wie man zwei getrennt arbeitende Filterformen hat. Ich habe versucht, die Filter im Modell so anzuordnen, wie sie in der Ansicht sind. Ich habe das filterrific_results div in das Partial verschoben. Trotzdem habe ich dieses seltsame Verhalten. Es scheint so, als würden alle Filter genau funktionieren. Ich bin mir nicht sicher, was ich sonst noch versuchen sollte.
Ich verwende:
filterrific (2.0.5)
Schienen (4.2.3)
Rubin-2.0.0-P643