Rails 4 - 编辑自动完成嵌套字段时设置显示值_for

Question

我正在开发一个表单，将食谱、recipe_entries（has_many_though 连接表）和配料与 Rails 4 中的 jQuery 自动完成功能联系起来。我正在使用 simple_form、cocoon 和 rails4-autocomplete gem 的组合。这个想法是用户可以创建一个食谱并通过自动完成动态添加和编辑相关的成分（每种成分的数量存储在连接表中）。

我的大部分功能都在工作，但唯一仍然困扰我的问题是我必须为 :ingredient 创建一个 f.input，它在编辑配方时会显示值，例如下图而不是所需的名称相关成分。

除此之外，我还可以动态创建、删除和更新所有成分关联。非常感谢任何提示。这是我的代码：

宝石文件

gem 'rails', '4.0.2'
gem 'jquery-rails'
gem 'jquery-ui-rails'
gem 'simple_form'
gem "cocoon"
gem 'rails4-autocomplete'

食谱.rb

class Recipe < ActiveRecord::Base
    has_many :recipe_entries, :dependent => :destroy
    has_many :ingredients, through: :recipe_entries

    accepts_nested_attributes_for :recipe_entries,:allow_destroy => true 
    accepts_nested_attributes_for :ingredients
end

RecipeEntry.rb

class RecipeEntry < ActiveRecord::Base
  belongs_to :recipe
  belongs_to :ingredient
end

成分.rb

class Ingredient < ActiveRecord::Base
    has_many :recipe_entries
    has_many :recipes, through: :recipe_entries
end

食谱表格：

<%= simple_form_for(@recipe) do |f| %>
  <% if @recipe.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@recipe.errors.count, "error") %> prohibited this recipe from being saved:</h2>
      <ul>
      <% @recipe.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>
    <%= f.input :name %>
    <%= f.input :description %>
    <div id="recipe_entries">
      <%=  f.simple_fields_for :recipe_entries, :input_html => { :class => "form_inline" } do |entry|%>
          <% render 'recipe_entry_fields', :f => entry %>    
      <% end %>
      <%= link_to_add_association 'add recipe entry', f, :recipe_entries%> 
    </div>
   <%= f.button :submit %>
<% end %>

recipe_entry_partial

<div class="nested-fields">

    <% @it=f.options[:child_index] %>
    <%= f.input :ingredient_id, as: :hidden, input_html: {id: "ingredient_id#{@it}"} %>
    <%= f.input :ingredient, :url => autocomplete_ingredient_name_recipes_path, :as => :autocomplete, :input_html => {id_element: "#ingredient_id#{@it}"}, placeholder: "Enter ingredient..." %>
    <%= f.input :quantity %>

    <%= link_to_remove_association "remove entry form", f %>
</div>

更新 我相信解决编辑显示问题的最简单方法是在包含自动完成功能的 f.input 中预先插入正确的值。例如

<%= f.input :ingredient, :url => autocomplete_ingredient_name_recipes_path, :as => :autocomplete, :input_html => {id_element: "#ingredient_id#{@it}", value: f.object.ingredient.name}, placeholder: "Enter ingredient..." %>

不幸的是，这只适用于配方条目关联。这意味着我仍然可以获得例如值f.object.ingredient_id 返回正确的结果。但是，我再也找不到相关的成分了。我似乎能够获得相关的成分，但是当我尝试例如调用它的 .name 方法，我收到一个 nil 错误。

奇怪的是，我可以通过调用 f.object.ingredient_id 来获取成分 ID，并且可以通过调用例如从模型中检索成分。成分.get(1).name。但是，我无法动态链接这两个值。 Ingredient.get(f.object.ingredient_id) 返回 nil 错误。也可以使用 to_string 或 to_integer 调用。

Answer 1

好的，嵌套表单内完全自动完成的解决方案如下：

<div class="nested-fields">
    <% @it=f.options[:child_index] %>
    <%= f.input :ingredient_id, as: :hidden, input_html: {id: "ingredient_id#{@it}"} %>
        <%= f.simple_fields_for :ingredients, f.object.ingredient do |ii| %>
            <%= ii.input :name, :url => autocomplete_ingredient_name_recipes_path, :as => :autocomplete, :input_html => {id_element: "#ingredient_id#{@it}"}, placeholder: "Enter ingredient..." %>
        <% end %>
    <%= f.input :quantity %>

    <%= link_to_remove_association "remove entry form", f %>
</div>

诀窍是将 f.input 自动完成放置在另一个 fields_for 标记中，并确保使用 f.object.ingredient 为每个 recipe_entry 指定上下文。除了这个部分，我不需要做任何其他的改变！