html - 具有多个输入的 Rails4 自动完成表单 - HTML data-id-element 被覆盖

Question

我正在尝试构建一个表单，该表单将从数据库中建议药物名称，但会发送所选药物的 ID 以在我的数据库中创建关系。

我使用了自动完成 gem，效果很好，我还使用了他们的提示从元素名称中获取 ID，这也很好用，但仅限于表单上有一个 INPUT 元素的地方。在我的例子中，我需要 5 个输入，并且由于我的代码 - 它不断覆盖名为 my_medicine_id 的元素，这导致只有一个 - 最后一个 - 元素被保存。你们能想到任何动态更改字段名称的解决方案吗？

我的处方 Controller

[...]
    def new
        @prescription =Prescription.new
        5.times { @prescription.relations.build }
    end
[...]

我的观点

[...]
        <ol>
            <%= f.fields_for :relations do |builder| %>
                <%= builder.hidden_field :medicine_id, :id => "my_medicine_id" %>
                <%= builder.autocomplete_field :medicine_name, autocomplete_medicine_name_relations_path, :id_element => '#my_medicine_id' %>
            <% end %>
        </ol>
[...]

生成最终的 html:

<input id="my_medicine_id" type="hidden" rows="5" name="prescription[relations_attributes][0][medicine_id]"></input>
<input id="prescription_relations_attributes_0_medicine_name" type="text" rows="5" name="prescription[relations_attributes][0][medicine_name]" data-id-element="#my_medicine_id" data-autocomplete="/relations/autocomplete_medicine_name"></input>
<input id="my_medicine_id" type="hidden" rows="5" name="prescription[relations_attributes][1][medicine_id]"></input>
<input id="prescription_relations_attributes_1_medicine_name" type="text" rows="5" name="prescription[relations_attributes][1][medicine_name]" data-id-element="#my_medicine_id" data-autocomplete="/relations/autocomplete_medicine_name"></input>
<input id="my_medicine_id" type="hidden" rows="5" name="prescription[relations_attributes][2][medicine_id]"></input>
<input id="prescription_relations_attributes_2_medicine_name" type="text" rows="5" name="prescription[relations_attributes][2][medicine_name]" data-id-element="#my_medicine_id" data-autocomplete="/relations/autocomplete_medicine_name"></input>
<input id="my_medicine_id" type="hidden" rows="5" name="prescription[relations_attributes][3][medicine_id]"></input>
<input id="prescription_relations_attributes_3_medicine_name" type="text" rows="5" name="prescription[relations_attributes][3][medicine_name]" data-id-element="#my_medicine_id" data-autocomplete="/relations/autocomplete_medicine_name"></input>
<input id="my_medicine_id" type="hidden" rows="5" name="prescription[relations_attributes][4][medicine_id]"></input>
<input id="prescription_relations_attributes_4_medicine_name" type="text" rows="5" name="prescription[relations_attributes][4][medicine_name]" data-id-element="#my_medicine_id" data-autocomplete="/relations/autocomplete_medicine_name"></input>

正如您每次覆盖元素 data-id-element="#my_medicine_id" 时所见。

Answer 1

OP 的解决方案。

找到解决方案 - 将 fields_for 内部移动到部分并使用 f.options[:child_index]。

固定 View 文件:

[...]
            <%= f.fields_for :relations do |builder| %>
                <%= render 'child_form', :f => builder %>
            <% end %>
[...]

和部分_child_form.html.erb

<% @it=f.options[:child_index] %>
<%= f.hidden_field :medicine_id, :id => "my_medicine_id#{@it}" %>
<%= f.autocomplete_field :medicine_name, autocomplete_medicine_name_relations_path, :id_element => "#my_medicine_id#{@it}" %>