Question

我有一个购物车应用程序，您可以从目录中选择产品。我想通过ajax动态填充一些列，例如基于选择的可用颜色。

这是我添加新项目时的视图

<td><%= f.collection_select(:product_id, Product.active.all, :id, :name, :prompt => 'Select Product') %></td>
<td><%= f.text_field :quantity, :size => 6 %></td>
<td><%= f.collection_select(:color_id, Color.all, :id, :name, :prompt => 'Select Color') %></td>
<td><%= f.text_field :price, :size => 8 %></td>
<td><%= f.link_to_remove "remove" %></td>

我想根据product_id值设置价格和颜色选项。这是我到目前为止：

$('select#order_items_new').change(function() {
    // How to retrieve table columns based on product_id value?
});

Answer 1

我希望能准确理解你的挑战。选择产品后，颜色选择将通过ajax和价格显示。

这是产品选择。

<%= form_tag "some_form" do |f|  %>
  Choose a product:
  <%= select_tag "product_id", options_for_select( @products.collect { |p| [p.name, p.id]} ), :include_blank => true  %>
  <br>
  <div id="colors_select"></div>
<% end %>

更改产品选择后，ajax将关闭并检索产品颜色和价格。

$(document).ready(function() {
  $("#product_id").live("change", function() {
    $.ajax({
      url: '/get_colors',
      data: {
        product_id: $(this).val();
      },
      cache: false,
      success: function(html) {
        $("#colors_select").html(html);
      }
    });
  });
});

不要忘记将路由包含在返回颜色的方法中。

App::Application.routes.draw do
  match 'get_colors' => 'colors#get_colors'

一种简单的方法，它返回颜色和价格的部分。一旦建立了关联，您就可以获得特定产品的颜色：Product.find（params [：product_id]）。colors

class ColorsController < ApplicationController

  def get_colors
    @colors = Color.all
    @price = Product.find(params[:product_id]).price
    render :partial => 'get_colors'
  end

使用rails和jquery进行动态选择

1 个答案: