Мгновенный поиск в rails не отображает правильный вывод

Question

Я кодирую небольшое приложение с поиском, позволяющим пользователю находить продукты. Пользователь может найти продукты по name и может фильтровать продукцию по price & weight (выход представляет собой список товаров в порядке убывания по цене или весу). Я использую gem pg-search на моей модели продукта:

class Product < ActiveRecord::Base 
    include PgSearch 
    pg_search_scope :search, 
    :against => [:name], 
    :using => {:tsearch => {:prefix => true} } 

Это мой Индексный метод в ProductController:

def index 
    if params[:content].present? && (params[:price] == "1") 
     @products = Product.search(params[:content]).order(price: :desc) 
     respond_to do |format| 
     format.js {} 
     format.html{ render :index } 
     end 
    elsif params[:content].present? && (params[:weight] == "1") 
     @products = Product.search(params[:content]).order(weight: :desc) 
     respond_to do |format| 
     format.js {} 
     format.html{ render :index } 
     end 
    elsif params[:content].present? 
     @products = Product.search(params[:content]) 
     respond_to do |format| 
     format.js {} 
     format.html{ render :index } 
     end 
    elsif params[:price] == "1" 
     @products = Product.all.order(price: :desc) 
     respond_to do |format| 
     format.js {} 
     format.html{ render :index } 
     end 
    elsif params[:weight] == "1" 
     @products = Product.all.order(weight: :desc) 
     # binding.pry 
     respond_to do |format| 
     format.js {} 
     format.html{ render :index } 
     end 
    else 
     @products = Product.all 
     # binding.pry 
    end 
    end 

это частичное, что делает результаты поиска продукта:

<div id="js-product-row"> 
    <%if @products.empty?%> 
    <p> 
     <strong>Il n'y a pas encore de produit sur le site</strong> 
    </p> 
<%else%> 
    <% @products.each do |product| %> 
     <div class="panel panel-default"> 
     <div class="panel-body"> 
      <div class="container-fluid"> 
      <div class="row"> 
       <div class="col-md-2"> 
       <%= image_tag product.picture.url(:medium)%> 
       </div> 
       <div class="col-md-offset-3 col-md-3"> 
       <p><strong> 
        <%= product.description %> 
       </strong></p> 
       </div> 
       <div class="col-md-4"> 
       <strong> 
        <%= product.price %> € 
       </strong> 
       <strong> 
        <%= product.weight %> Kg 
       </strong> 
       <div> 
        <%= link_to "En savoir plus", product_path(product) %> 
       </div> 
       </div> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div> 
    <% end -%> 
<% end -%> 

и это файл js для обновления вида без перезагрузки страницы:

$(document).ready(function(){ 
    $('#js-product-row').html("<%= escape_javascript(render 'products')%>"); 
}); 

Когда я отлаживаю консоль, @products всегда дает мне массив с тем, что я хочу в нем, в правильном порядке, поэтому кажется, что логика заднего конца в порядке. Но каждый раз, когда я что-то ищу или активирую фильтр, результат вывода неправильный: информация о правильном экземпляре (фактически в массиве @products) отображается дважды, наряду с другими продуктами, которые не находятся в @products. Я не понимаю, почему это происходит.

Answer 1

Попробуйте использовать .replaceWith вместо .html в противном случае удалить <div id="js-product-row"> с частичным.

например:

$('#js-product-row').replaceWith("<%= j(render 'products') %>"); 

То, что я думаю, что происходит в том, что у вас есть

<div id="js-product-row"> 
... 
</div> 

Затем поиск, который добавляет HTML следующим образом:

<div id="js-product-row"> 
    <div id="js-product-row"> 
    ... 
    </div> 
</div> 

Запуск снова (например, двойные результаты):

<div id="js-product-row"> 
    <div id="js-product-row"> 
    ... 
    </div> 
    <div id="js-product-row"> 
    ... 
    </div> 
</div> 

Bonus Update:

В качестве примечания можно DRY (не повторяться) ваш контроллер выглядеть примерно так:

def index 
    @products = Product 
    if params[:content].present? 
    @products = @products.search(params[:content]) 
    end 
    if params[:price] == "1" 
    @products = @products.order(price: :desc) 
    elsif params[:weight] == "1" 
    @products = @products.order(weight: :desc) 
    end 
    @products = @products.all 
    format.js 
    format.html 
end