Rails: Wie kann ich die Suche nach Name automatisch vervollständigen, aber ID speichern?

Question

Ich habe dieses Video http://railscasts.com/episodes/102-auto-complete-association-revised verwendet, um eine Autocomplete-Sucheingabe in einem Formular für meine App einzurichten. (Das Video ist möglicherweise nur für Mitglieder, also poste ich auch meinen Code. Im Wesentlichen durchsucht es eine Spalte des DB (Name) und vervollkommnet in einem Dropdown, während Sie tippen. Das alles funktioniert aber gut, was ich gerne hätte Formular zu tun ist, senden Sie die ID, die korreliert mit dem Namen, nicht der Name selbst.

Ich gehe davon aus, es gibt keine einfache Möglichkeit, dies nur in der Ansicht zu tun. Jede Hilfe wäre toll. Code unten, lass es mich wissen wenn ein anderer Code wäre hilfreich

Dank

Controller:.

def game_name 
    game.try(:name) 
end 

def game_name=(name) 
    self.game = Game.find_by_name(name) if name.present? 
end 

Coffee:

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

Nach Ansicht:

<%= f.label :game_name, "Search for a game" %> 
    <%= f.text_field :game_name, :class => "mlm mtm", data: {autocomplete_source: Game.order(:name).map(&:name)} %> 

Answer 1

Zusätzlich zur Ausführung von @LukasSvoboda können Sie auch den Rückruf selectevent überschreiben, der ausgelöst wird, wenn Sie ein Element aus dem Dropdown auswählen. Im Callback können Sie das Textfeld (das nicht gesendet werden muss) auf das "Label" des ausgewählten Elements setzen und den Wert eines versteckten Feldes der Game-ID (die nicht gesendet werden muss) festlegen der "Wert" des ausgewählten Artikels.

In Kaffee:

jQuery -> 
    $('#play_game_name').autocomplete 
    source: $('#play_game_name').data('autocomplete-source') 
    select: (event, ui) -> 

    # necessary to prevent autocomplete from filling in 
    # with the value instead of the label 
    event.preventDefault() 

    $(this).val ui.item.label 
    $('#game_id').val ui.item.value 

In Markup:

<%= text_field_tag nil, nil, :id => 'play_game_name', :class => "mlm mtm", data: {autocomplete_source: Game.order(:name).map { |t| { :label => t.name, :value => t.id } } %> 
<%= f.hidden_field :game_id, id: 'game_id' %> # tailor to your model 

Answer 2

Durch die http://api.jqueryui.com/autocomplete/#option-source Sie auf die Autocomplete-Datensatz kann.

Sie müssen die text_field Linie ändern wie:

<%= f.text_field :game_name, :class => "mlm mtm", data: {autocomplete_source: Game.order(:name).map { |t| { :label => t.name, :value => t.id } } %> 

Für erweiterte Funktionen betrachten select2 oder gewählt zu verwenden.