In Rails, was ist der beste Weg zur automatischen Vervollständigung, die Namen zeigt, aber IDs verwendet?

Question

Ich möchte ein Textfeld haben, das der Benutzer eingeben kann, zeigt eine AJAX-Liste der Namen meines Modells, und wenn der Benutzer einen auswählt, möchte ich die HTML-ID des Modells speichern und das Formular verwenden Wird eingereicht.

Ich habe an das Auto_Complete-Plugin gestoßen, das in Rails 2 ausgeschnitten wurde, aber es scheint keine Ahnung zu haben, dass dies nützlich sein könnte. Es gibt eine Railscast episode, die das Verwenden dieses Plugins behandelt, aber dieses Thema wird nicht berührt. Die Kommentare point out that it could be an issue und point to model_auto_completer as a possible solution, die zu funktionieren scheint, wenn die angezeigten Elemente einfache Zeichenfolgen sind, aber der eingefügte Text viele Junk-Leerzeichen enthält, wenn (wie ich gerne tun würde) Sie ein Bild in die Listenelemente, despite what the documentation says.

Ich könnte wahrscheinlich model_auto_completer in Form hacken, und ich kann immer noch tun, aber ich bin gespannt, ob es bessere Möglichkeiten gibt.

Answer 1

Ich habe eine abgedroschene Lösung für die Junk-Spaces aus dem Bild. Ich fügte einen :after_update_element => "trimSelectedItem" dem Optionshash des model_auto_completer hinzu (das ist der erste Hasch der drei gegebenen). Mein trimSelectedItem findet dann das entsprechende Unterelement und verwendet den Inhalt des für den Elementwert:

function trimSelectedItem(element, value, hiddenField, modelID) { 
    var span = value.down('span.display-text') 
    console.log(span) 
    var text = span.innerText || span.textContent 
    console.log(text) 
    element.value = text 
} 

Dies ist jedoch dann läuft afoul der :allow_free_text Option, die den Text standardmäßig, sobald der Text ändert sich zurück Die Box verliert den Fokus, wenn der darin enthaltene Text kein "gültiger" Eintrag aus der Liste ist. Also musste ich das auch ausschalten, indem ich :allow_free_text => true in den Options-Hash (wieder der erste Hash) übergab. Ich würde es wirklich lieber behalten.

Also meine aktuellen Aufruf der Autocompleter zu erstellen ist:

<%= model_auto_completer(
    "line_items_info[][name]", "", 
    "line_items_info[][id]", "", 
    {:url => formatted_products_path(:js), 
    :after_update_element => "trimSelectedItem", 
    :allow_free_text => true}, 
    {:class => 'product-selector'}, 
    {:method => 'GET', :param_name => 'q'}) %> 

und die Produkte/index.js.erb ist:

<ul class='products'> 
    <%- for product in @products -%> 
    <li id="<%= dom_id(product) %>"> 
      <%= image_tag image_product_path(product), :alt => "" %> 
      <span class='display-text'><%=h product.name %></span> 
    </li> 
    <%- end -%> 
</ul> 

Answer 2

Ich rollte meine eigenen. Der Prozess ist ein wenig verschachtelt, aber ...

Ich habe gerade ein Text_field auf dem Formular mit einem Beobachter. Wenn Sie mit der Eingabe in das Textfeld beginnen, sendet der Beobachter die Suchzeichenfolge und der Controller gibt eine Liste von Objekten zurück (maximal 10).

Die Objekte werden dann zum Rendern über einen Teil gesendet, der die Ergebnisse der dynamischen automatischen Vervollständigung ausfüllt. Das Teil füllt tatsächlich link_to_remote Zeilen, die wieder zurück an den Controller senden. Die link_to_remote sendet die ID der Benutzerauswahl und dann bereinigt einige RJS die Suche, füllt den Namen in das Textfeld ein und platziert die ausgewählte ID dann in ein verstecktes Formularfeld.

Puh ... Ich konnte zu dieser Zeit kein Plugin dafür finden, also habe ich mein eigenes gerollt, ich hoffe, das macht alles Sinn.