Question

我觉得应该有一个非常简单的解决方案......但是我无法找到它。

我正在使用jquery在依赖于另一个选择框的表单中动态生成一个选择框。

在我的视图中提取表单代码：

form_for @unit do |f|

    <td> f.collection_select :shop_id, @shops, :id, :name </td>     # this is the first select box

    <td id="options"></td>     # this is the id tag that jquery finds and replaces with the second select box, depending on the value of the first select box

在我的 application.js 中，我有一个功能，可以抓取第一个选择框的值并将其发送给我的控制器：

jQuery(function($) {

    // when the #shop field changes
    $("#unit_shop_id").change(function() {

    var shop_id
    shop_id = $('select#unit_shop_id :selected').val();

    // make a GET call and replace the content
    jQuery.get('/units/options/' + shop_id )
    return false;
    });
});

并在我的 units_controller 中，我根据shop_id设置第二个选择框的选项并调用js.erb文件：

def options     # note params[:id] is the shop_id specified by the first select box

    if params[:id] == 0 
        @options = ["Yes", No", "Maybe"]
            elsif params[:id] == 1
                @options = ["Yes", Maybe"]
            else
                @options = ["Yes"]
            end

    respond_to do |format|
        format.js {}
    end
end

我的 options.js.erb 文件dynamiclaly显示我的第二个选择框：

$("#options").html( "<%= escape_javascript(select("product_id", @options)) %>" );

这一切都很完美。我的表单会显示，当我在第一个选择框中选择一个值时，它会确定我的第二个选择框中可用的选项。

我挣扎的是如何将我在第二个选择框中选择的值添加到表格参数中。

生成的表格参数是：

    "unit"=>{"shop_id"=>"x"}    (i.e. only the first select box)

我想生成包含由jquery动态生成的第二个选择框的表格参数，即：

    "unit"=>{"shop_id"=>"x", "product_id=>"y"}

知道如何做到这一点？我尝试在product_id的表单中使用hidden_field，但我似乎无法成功引用product_id。

Answer 1

查看select的文档，看起来select的定义如下：

select(object, method, choices = nil, options = {}, html_options = {}, &block)

我相信同时使用对象（unit）和方法（product_id）可以为您提供所需的行为。

$("#options").html( "<%= escape_javascript(select("unit", "product_id", @options)) %>" );

使表单参数中的动态生成的选择框值可用

1 个答案: