Ruby on Rails - 简单表单自动完成关联搜索

我在基本任务管理应用程序中有一个表单，允许将任务分配给用户（任务属于用户）。我为此使用简单表格。

目前，该关联以典型方式填充，带有用户下拉列表，如下所示：<%= f.association :user, label_method: :name, value_method: :id, include_blank: false %>.

但是，随着用户数量的增长，我希望将其更改为自动完成表单字段以查找用户。我尝试过遵循Railscast 的主题 http://railscasts.com/episodes/102-auto-complete-association-revised，尽管它不使用简单表单并且不适用于我的实现。

这是我的表格、模型和 .coffee 代码：

Form

<%= simple_form_for @task do |f| %>
  ...
  <%= f.input :user_name, as: :search, data: 
      {autocomplete_source: User.pluck(:name)} %>
  ...
  <%= f.button :submit %>
<% end %>

Model

# Virtual attribute for autocomplete form field
  def user_name
    user.try(:name)
  end

  def user_name=(name)
    self.user = User.find_by_name(name) if name.present?
  end

任务.咖啡

jQuery ->
  $('#task_user_name').autocomplete
    source: $('#task_user_name').data('autocomplete-source')

这会生成以下 HTML：

<input class="string search optional form-control 
ui-autocomplete-input ui-autocomplete-loading" type="search" 
value="Robert Strong" name="task[user_name]" id="task_user_name" 
autocomplete="off">

虽然开发工具控制台中出现以下错误：

Uncaught TypeError: this.source is not a function

关注autocomplete="off"在 HTML 中，无法想象 TypeError 有多大帮助！

我很困惑，因此非常感谢任何有关使其正常工作的建议！预先感谢，让我知道你的想法，史蒂夫。

autocomplete_source 需要一个数组或 URL，调用该数组或 URL 时会返回 JSON 以及与查询匹配的结果。http://api.jqueryui.com/autocomplete/#option-source http://api.jqueryui.com/autocomplete/#option-source

现在你有

  <%= f.input :user_name, as: :search, data: 
  {autocomplete_source: User.pluck(:name)} %>

那可能会返回一个 JavaScript 字符串。所以你可以把它改成这样：

  <%= f.input :user_name, as: :search, data: 
  {autocomplete_source: User.pluck(:name).to_json} %>

然后在设置自动完成时解析该 JSON：

jQuery ->
  $('#task_user_name').autocomplete
    source: JSON.parse($('#task_user_name').data('autocomplete-source'))

但从长远来看（当您有很多用户时），这将显着影响页面的加载时间。您实际上应该遵循该railscast 并将URL 作为自动完成源：

  <%= f.input :user_name, as: :search, data: 
  {autocomplete_source: users_path} %>

确保将 json 渲染路径添加到用户控制器上的索引操作中。

如果您的索引操作也用于其他用途，您可以使用respond_to:

# users_controller
def index
  @users = User.order(:name)
  @users = @users.where("name like ?", "%#{params[:term]}%") if params[:term]

  respond_to do |format|
    format.html  # index.html.erb
    format.json  { render :json => @users.map(&:name) }
  end
end