我正在使用Rails 3和ruby 1.9.2。我有一个店面列出了几个产品,我想让用户能够按dept_type
过滤产品。 dept_type
是产品的属性,而不是单独的模型。我的模型中有以下内容:
class Product < ActiveRecord::Base
DEPT_TYPES = ["Baby","Beauty", "Household", "Pets"]
我的控制器:
class StoreController < ApplicationController
def index
@title= "Home"
if Product.all.collect(&:dept) == (params[:dept])
@products= Product.send(params[:dept])
else
@products = Product.order(:premium)
end
end
在我看来:
<%= select("dept", "dept_type", Product.all.collect(&:dept)) %>
<% @products.each do |product| %>
...
<%end%>
当我加载页面时,我有所有DEPT_TYPES
选项的下拉列表但是当我选择一个没有任何反应时。我需要做什么才能让页面只更新和过滤选定的部门?
答案 0 :(得分:2)
我会在select和UJS上使用ajax来更改内容,从部分加载。
e.g。
#/railsapp/app/controllers/products_controller.rb
def index
@title= "Home"
if Product.all.collect(&:dept_type) == (params[:dept])
@products= Product.send(params[:dept])
else
@products = Product.order(:premium)
end
respond_to do |format|
format.html # index.html.erb
format.js # index.js.erb
format.json { render json: @products }
end
end
在你看来
#/railsapp/app/views/products/index.html.erb
<%= form_tag('products', :remote => true) do %>
<%= select_tag "dept", options_from_collection_for_select(@products, "id", "dept_type"), { :include_blank => true , :class => "product_select"} %>
<% end %>
<div id="products_list"></div>
然后添加javascript(本例中为coffeescript)
#/railsapp/app/assets/javascripts/products.js.coffee
$(document).ready ->
$(".product_select").on "change", ->
$.ajax
url: "/products"
type: "GET"
dataType: "script"
data:
dept_type: $(".product_select").val()
因此,coffeescript在更改选择框时对产品控制器的索引操作发出ajax请求。控制器将呈现UJS模板,因为dataType是脚本。现在为UJS
#/railsapp/app/views/products/index.js.erb
$("#products_list").html('<%= j render("product_list") %>').fadeIn('slow');
这只是在部分product_list上调用javascript转义渲染,其中包括:
#/railsapp/app/views/products/_product_list.html.erb
<%- @products.each do |product| %>
<%= product.name %>
<% end %>
所以现在你将有一个选择框,它在页面加载时呈现html,在ajax请求上运行javascript以确定正确的部门,并在从下拉列表中更改选择时交换列表。