選擇下拉選項后，Rails如何通過Ajax更新索引視圖

Question

我有一個帶有“部門”屬性的產品模型。 該模型包括部門列表。 在我看來，是一個包含所有部門類型的下拉列表。 從下拉列表中選擇部門后，我試圖刷新頁面。 我希望通過AJAX對其進行更新，但目前仍無法正常進行頁面引用。

我的模特

 class Product < ActiveRecord::Base
   attr_accessible :dept, :price, :title
   DEPT_TYPES = ["Baby","Beauty"]
 end

我的控制器：

class StoreController < ApplicationController
  def index
    @title= "Home"
    @products = Product.order(:premium)
    @baby , @beauty = [], []
    @products.each do |product|
      @baby << product if product.dept == 'Baby'
      @beauty << product if product.dept == 'Beauty'
    end

    respond_to do |format|
      format.html # index.html.erb
      format.js # index.js.erb
      format.json { render json: @products }
    end 
  end

我的觀點

<div class ="filter">
  <select>
    <option value="<%=@baby%>">baby</option>
    <option value="<%=@beauty%>">beauty</option>
  </select>
</div>

 <div id="products_list">
   <% @products.each do |product|%>
     ...
   <%end%>

Answer 1

您可以使用簡單的ajax jQuery函數：

$(".filter").change(function(){
  var value = $(this).val()
  $.ajax({
    url: <%= stores_path(:json) %>,
    type: 'GET',
    data: value,
    success: function(data){
      $("#products_list").html(data.products)
    }
  })
})

您有兩種方法：第一種是從服務器發送所有產品的JSON例如。 或者，您可以在視圖中創建“ .js.erb”文件並在其中處理操作。