Rails jQuery 自动完成和动态嵌套字段

Posted 2023-05-09

【中文标题】Rails jQuery 自动完成和动态嵌套字段

【英文标题】：Rails jQuery autocomplete and dynamic nested fields

【发布时间】：2014-04-02 14:29:35

【问题描述】：

我有一个应用程序，我在其中使用 gems rails3-jquery-autocomplete 和 nested_form 建议将现有用户标记为项目条目的贡献者。

表单视图：

<%= f.fields_for :contributors do |contributor|%>
    <%= contributor.autocomplete_field :name, autocomplete_user_profile_last_name_projects_path, :update_elements =>  :user_id => "#user_id"  %><br>
    <%= contributor.hidden_field :user_id %>
    <%= contributor.radio_button :contributor_type, 'Colleague' %> 
    <%= contributor.radio_button :contributor_type, 'Supervisor' %> 
    <%= contributor.radio_button :contributor_type, 'Client' %> 
    <%= contributor.link_to_remove "Remove this contributor" %>
<% end %>
<%= f.link_to_add "Add a contributor", :contributors %><br> 

我还覆盖了get_autocomplete_function(parameters) 函数，以便在我的自动完成中允许多列，即first_name 和last_name 列

def get_autocomplete_items(parameters)
  items = UserProfile.select("DISTINCT CONCAT_WS(' ', first_name, last_name ) AS full_name, first_name, last_name, id, user_id").where(["CONCAT_WS(' ', first_name, last_name) LIKE ?", "%#parameters[:term]%"])
end

我的项目控制器中还有以下行：

autocomplete :user_profile, :last_name, :full => true, :extra_data => [:first_name, :last_name, :user_id ], :display_value => :fullname

使用 `fullname' 函数：

def fullname
    "#first_name #last_name"
end

我想要做的是从自动完成项中获取user_id 的值并将其值放在隐藏字段中，但是当我检查服务器时，它会输出如下内容：

 Parameters: "utf8"=>"✓", "authenticity_token"=>"DYQ7iJeqdwMQrprSGn0WNHXY5iXDZLA5pUd3OlYJ2so=", "project"=>"creator"=>"1", "title"=>"lesdodis", "contributors_attributes"=>"0"=>"name"=>"Test User the 1st", "user_id"=>"", "contributor_type"=>"Client", "_destroy"=>"false", "id"=>"21", "1"=>"name"=>"Test User the 2nd", "user_id"=>"", "contributor_type"=>"Supervisor", "_destroy"=>"false", "id"=>"22", "1393677266696"=>"name"=>"", "user_id"=>"", "_destroy"=>"1", "1393677267518"=>"name"=>"", "user_id"=>"", "_destroy"=>"1", "description"=>"asdad", "tag_list"=>"sdads", "link"=>"asdasd", "gallery_attributes"=>"screenshots_attributes"=>"0"=>"description"=>"", "_destroy"=>"false", "id"=>"10", "id"=>"16", "commit"=>"Update", "id"=>"16"

贡献者内部的user_id 字段留空。我已经尝试使用contributor.object.id 为字段名称手动分配唯一编号，但成功有限，因为新的动态添加字段没有对象ID。我正在使用此表单来创建和更新项目条目，因此无论编辑字段还是添加新字段，我都想寻求帮助以使其工作。

更新： 经过一段时间的搜索，我终于通过添加此代码使其工作

<% field_name = "#contributor.object_name[user_id]".gsub(/(\])?\[/, "_").chop %>
<%= contributor.autocomplete_field :name, autocomplete_user_profile_last_name_projects_path, :update_elements =>  :user_id => "##field_name"  %><br>

我希望这对可能遇到同样问题的人有所帮助。

【参考方案1】：

我也一直在努力解决类似的问题。在您的情况下，我的感觉是 nested_form 助手正在生成唯一标识符，这些标识符正在破坏传递给 :update_elements 的“#user_id”选择器。

您可以通过挂钩到每个 gem 的事件流，然后手动更新表单中特定贡献者的隐藏 :user_id 来解决此问题。对于动态添加的贡献者，可能类似于：

$(document).on('nested:fieldAdded', function(nf_event) 
  var ac_input = nf_event.field.find('.ui-autocomplete-input');
  ac_input.bind('railsAutocomplete.select', function(ac_event, data) 
    $(this).next('input[type=hidden]').val(data.item.id);
  );
);

对于通过现有关联（即编辑）生成的贡献者，您可以在 $(document).ready() 上绑定到他们的自动完成输入。这至少可以让你指出正确的方向。

【参考方案2】：

经过一段时间的搜索，我终于通过添加此代码使其工作

<% field_name = "#contributor.object_name[user_id]".gsub(/(\])?\[/, "_").chop %>
<%= contributor.autocomplete_field :name, autocomplete_user_profile_last_name_projects_path, :update_elements =>  :user_id => "##field_name"  %>

我希望这对可能遇到同样问题的人有所帮助。