Ruby on Rails - 簡單表單自動完成關聯搜索

Question

我在基本任務管理應用程序中允許任務分配給用戶（任務belongs_to用戶）。我爲此使用簡單表單。

當前，該關聯以典型的方式填充，用戶下拉列表如下：<%= f.association :user, label_method: :name, value_method: :id, include_blank: false %>。

但是，隨着用戶數量的增長，我正在將此更改爲自動填充表單字段以查找用戶。我試過按照Railscast on the subject，雖然它不使用簡單的形式，並沒有在我的實施工作。

這裏是我的形式，型號和.coffee代碼：

表

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

型號

# 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 

tasks.coffee

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 

關注HTML中的autocomplete="off"和無法想象的類型錯誤幫助許多！

我很難過，所以非常感謝任何建議，讓這個工作！在此先感謝，讓我知道您的想法，史蒂夫。

Answer 1

autocomplete_source期待一個數組或URL在被調用時返回與查詢匹配的結果的JSON。 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