如何使用json数组填充Rails下拉菜单

我有一个Ant显示页面，显示有关各种类型ant的详细信息。 在那个页面上有两个下降，一个用于环境：[室内，室外]，一个用于饮食：[糖，脂肪，蛋白质]。

当您从每个参数中选择一个参数时，它会根据参数显示一个产品页面。 然而，一些组合导致零，如木匠ant没有与室内糖相关的产品。

我试图根据组合是否为零来获取下拉列表。 如果有人选择室内，我会喜欢糖，如果该组合不存在则不会出现在下一个下拉列表中。

到目前为止，我有两种方法只为可用的项创建json数组：

def food_sources food_sources = Ant.find(params[:ant_id]).product_recommendations.where(environment: params[:environment]).map(&:diet) render json: food_sources.to_json end def environments environments = Ant.find(params[:ant_id]).product_recommendations.where(diet: params[:diet]).map(&:environment) render json: environments.to_json end 

例如，如果输入

 http://localhost:3000/ants/27/food_sources?environment=indoor 

进入浏览器返回

 ["sugar","protein"] 

对于id为27的ant，bc只有两种户外室内饮食选择，而不是可能的三种。

我的问题是，如果有人选择了上述组合，我如何将此数组传递到我的rails下拉列表？

编辑

 = form_tag ant_product_recommendations_path(@ant.id), id: 'select_box', method: :get do |form| %h3 What food source are they currently feeding on? = select_tag :environment, options_for_select([["Select One"], "Indoor", "Outdoor"]) %h3 Locate the nest by following the ants back from their food source. %br Where is the nest located? = select_tag :diet, options_for_select([["Select One"], "Sugar", "Fat", "Protein"]) = submit_tag "Find Solutions", class: 'submit button' = link_to 'Go Back', '/', class: 'go_back' 

Answer 1

在我看来，你想要动态填充下拉框，这将适合ajax调用，如下所示：

 $('#select_box').on('change', function () { $.ajax({ url: "/controller/action", type: 'get', data: $(this).serialize() }).done(function (data) { change_select(data); }); }); function change_select(data) { var json = jQuery.parseJSON(data); var options = []; json.each(function (key, index) { options.push({text: index, value: key}); }); $("#select_box").replaceOptions(options); }; 

这将允许您指定下拉列表的选项，您可以通过以下方式使用控制器：

  @food_sources = Ant.find(params[:ant_id]).product_recommendations.where(environment: params[:environment]).map(&:diet) respond_to do |format| format.json { render json: @food_sources } end