Input-Eingabe mit Select-Elementen vergleichen

[blabla333]

Ist folgende Idee umsetzbar?

Ich habe ein Select-Element und daneben ein Input-Element. Nun sollte es so sein, dass der User einfach "drauflos tippen" kann. Ist die Eingabe in der Select-Liste vorhanden, wird diese aktiviert, ansonsten ist die Eingabe im Input-Feld.

Beispiel:

Select hat die Elemente "Gurken, Tomaten, Spinat".

Gibt der User nun Tomate ein, so wird dieses Element ausgewählt. Gibt er hingegen Banane ein, so wird das in das Input-Feld eingegeben.

Mein Konzept wäre, dass eine Eingabe zunächst immer im Input-Feld erfolgt. Nach jedem Zeichen wird überprüft, ob es dieses Element in der Liste gibt. Trifft das zu, wird das Element ausgewählt und das Input-Feld geleert.
...oder so ähnlich. Würde es gerne mit JQuery umsetzen...

 

[Cheffchen]

hallö,

die Antwort auf all deine fragen ist jquery.
damit kannst textfelder anfügen, selectfelder bearbeiten und vieles mehr.
such einfach mal nach jquery + deine frage.

cheffchen

 

[blabla333]

Ich versuche bereits das per JQuery umzusetzen, aber ich glaube ich brauche wieder einen "Einstiegs-Schubs"...

 

[Tronjer]

Du willst ein Autocomplete bauen, und das ist nicht ganz so simpel, wie es auf den ersten Blick aussehen mag. Was machst du, wenn der User ein 'a' eingibt und die Begriffe Ananas, Apfel und Aprikose gefunden werden? Zumal es ja auch nicht wirklich Sinn ergibt, Inhalte zu vervollständigen, die ohnehin bereits aus einer Select-Liste gewählt werden können. Normaler Weise verwendet man für so etwas ein keydown() Event, welches einen AJAX-Request an eine Datenbank sendet und ein JSON-Objekt zurückliefert.

Alternativ dazu kannst du auch Das Autocomplete von jQuery UI einsetzen.