Ruby on Rails - Поиск ассоциации автозаполнения формы Form

Question

У меня есть форма в базовом приложении для управления задачами, которое позволяет назначать задачи для пользователей (задача принадлежит пользователю). Для этого я использую Simple Form.

В настоящее время ассоциация заполняется обычным способом, с выпадающим списком пользователей как таковой: <%= f.association :user, label_method: :name, value_method: :id, include_blank: false %>.

Однако, по мере роста числа пользователей, я хочу изменить это в поле формы автозаполнения, чтобы найти пользователей. Я пробовал следовать за Railscast on the subject, хотя он не использует Simple Form и не работает над моей реализацией.

Вот моя форма, модель и .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"> 

Хотя следующее сообщение об ошибке в Dev инструментов консоли:

Uncaught TypeError: this.source is not a function 

обеспокоенных о autocomplete="off" внутри HTML и не может себе представить, TypeError помогает много!

Я в тупике, так что очень признателен за любые советы по получению этой работы! Спасибо заранее, дайте мне знать, что вы думаете, Стив.

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