Rails和Ajax：通过选择的filter显示产品

我需要使用Ajax按选定的类别显示产品; 如果用户未选择类别，则显示所有产品。 如果用户选择了一个或两个类别，则只应显示属于这些类别的产品。

例：

我的模型产品，类别和连接表cause_products

类别

class Category < ActiveRecord::Base has_and_belongs_to_many :products end

制品

class Product < ActiveRecord::Base has_and_belongs_to_many :categories end

我正在寻找一个教程，我找到了“Rails 4：” 如何分段和AJAX，很容易 “。我遵循了这个教程，但我得到了一个错误。我觉得我错过了一些东西。
您能否就此提出建议或参考有用的资料来源。 谢谢！

产品控制器：

 class ProductsController  params[:cat_id]) respond_to do |format| format.js end end end 

产品/ index.html.erb：

产品/ _sidebar_menu

   cat.id), :remote => true %>  

的routes.rb

 get "/fetch_products" => 'products#from_category', as: 'fetch_products' 

产品/ _products_grid.html.erb

产品/ _products_list.html.erb

  
 product.name 
  

产品/ from_category.js.erb

 $("#products_grid").html(""); 

我的终端输出：

 Product Load (3.2ms) SELECT `products`.* FROM `products` WHERE `products`.`category_id` = '11' Mysql2::Error: Unknown column 'products.category_id' in 'where clause': SELECT `products`.* FROM `products` WHERE `products`.`category_id` = '11' Rendered products/_products_list.html.erb (8.8ms) Rendered products/from_category.js.erb (12.2ms) Completed 500 Internal Server Error in 23ms (ActiveRecord: 3.5ms) ActionView::Template::Error (Mysql2::Error: Unknown column 'products.category_id' in 'where clause': SELECT `products`.* FROM `products` WHERE `products`.`category_id` = '11'): 1:  2: 
 3:  4: 
 app/views/products/_products_list.html.erb:1:in `_app_views_products__products_list_html_erb___255698018512654633_70336949043820' app/views/products/from_category.js.erb:1:in `_app_views_products_from_category_js_erb___4172137050793767106_70336965664480' app/controllers/products_controller.rb:24:in `from_category'` 

* – 最初的 sidebar_menu文件只包含一行：
cat.id), :remote => true %>
但是我收到了这个错误：

 Showing views/products/_sidebar_menu.html.erb where line #1 raised: undefined local variable or method `cat' for #<#:0x007ff1350376a8> Extracted source (around line #1):  cat.id), :remote => true %> 

更新1

@max的解决方案：

  def from_category @products = Product.joins(:categories).where(categories: { id: params[:cat_id] }) respond_to do |format| format.js end 

感谢@max的帮助，他的解决方案是更新控制器操作，它解决了错误，但选择类别后产品列表没有刷新。

日志：

 Started GET "/fetch_products?cat_id=11" for ::1 at 2016-04-18 13:53:01 +0300 Processing by ProductsController#from_category as JS Parameters: {"cat_id"=>"11"} Product Load (1.9ms) SELECT `products`.* FROM `products` INNER JOIN `categories_products` ON `categories_products`.`product_id` = `products`.`id` INNER JOIN `categories` ON `categories`.`id` = `categories_products`.`category_id` WHERE `categories`.`id` = 11 Rendered products/_products_list.html.erb (6.4ms) Rendered products/from_category.js.erb (11.5ms) Completed 200 OK in 29ms (Views: 24.1ms | ActiveRecord: 1.9ms) 

更新2：

@max这就是我点击某个类别时在响应中得到的结果：

 $("#products_grid").html(" 
\n Bed\n \n 
\n Notebook\n \n 
\n Desk\n \n 
\n Mug\n \n" ); 

@Jeffrey M Castro注意到我错过了div的products_grid id：

产品/ _products_grid.html.erb

该代码仅适用于一个选定的类别，但我希望它能够过滤两个或更多类别。 我需要做出哪些改变？

场景：用户点击“家庭类别”，他获得属于此类别的所有产品。 然后他点击“鞋子类别”，现在他看到属于这两个类别的所有产品（“家庭类别”或“鞋子类别”）。 用户点击“全部清除”按钮（为了重置所选类别），现在显示所有类别的所有产品。

谢谢。

Answer 1

由于您在产品和类别之间存在has_and_belongs_to_many关系，因此您无法通过products.category_id选择产品，因为两者之间的实际链接存储在categories_products连接表中。

您需要使用联接并在关联上指定条件：

 @products = Product.joins(:categories) .where(categories: { id: params[:cat_id] }) 

Answer 2

根据@max的响应，最好使用浏览器检查器的网络选项卡检查服务器提供的JS响应。

在你的代码中：

 $("#products_grid").html("<%= escape_javascript(render partial: 'products_list', locals: { products: @selected } ) %>"); 

您想要更改#products_grid的html内容，但我没有在您的视图文件中看到任何具有该ID的内容。
所以你必须在div中指定它的id是#products_grid ：

产品/ _products_grid.html.erb

 
 <%= render partial: 'products_list', locals: { products: products } %>