Auswahlliste mit Texteingabefeld

[Zinny2000]

Ich versuche, ein Textfeld und eine Auswahlliste mit vorgegebenen Begriffen derart zu kombinieren, dass durch Eingaben in das Textfeld (z.B. "Fahr") in der Auswahlliste automatisch zu dem entsprechenden Eintrag gesprungen wird (in diesem Fall "Fahrzeug"). Wenn man dann auf Fahrzeug klickt, soll sich in einem anderen FRAME die entsprechene Seite öffnen.

Kann mir jemand sagen, wie ich das mit HTML und JavaScript hinbekomme?

Vielen Dank und schönen Gruß

Zinny2000

[romy]

Hi,

Ich versuche, ein Textfeld und eine Auswahlliste mit vorgegebenen Begriffen derart zu kombinieren, dass durch Eingaben in das Textfeld (z.B. "Fahr") in der Auswahlliste automatisch zu dem entsprechenden Eintrag gesprungen wird (in diesem Fall "Fahrzeug"). Wenn man dann auf Fahrzeug klickt, soll sich in einem anderen FRAME die entsprechene Seite öffnen.

in etwa so:

das Textfeld mit einem entsprechenden event-handler versehen, zB. onChange
http://selfhtml.teamone.de/javascript/sprache/eventhandler.htm#onchange

durch diesen eine Funktion aufrufen, welche den entsprechenden Datensatz als selected markiert.
http://selfhtml.teamone.de/javascript/sprache/funktionen.htm#definieren
http://selfhtml.teamone.de/javascript/objekte/document.htm#get_elements_by_tag_name
http://selfhtml.teamone.de/javascript/objekte/htmlelemente.htm#select

den entsprechenden Datensatz mit Stringoperationen herausfinden
http://selfhtml.teamone.de/javascript/objekte/string.htm

ciao
romy

[Zinny2000]

Danke für die Antwort. Versuche mal, das nachzuvollziehen ;-)

Gruß

Zinny

[romy]

Hi,

habe mal einen Beispielcode erstellt, da ich dies auch nutzen will.
Aber es gibt Probleme beim matchen...

<code>
function findinSelect(){
   var wert = document.test.eingabe.value;
   var count = document.test.auswahl.length;
   var i = 0;
   wert = '/^'+wert+'/';
   while(i<count) {
      var text = document.test.auswahl.options[i].text;
      if(text.match(wert)) document.test.auswahl.options  [i].selected=true;
      i++;
   }
}

</code>

so wird nicht zur entsprechenden Option gesprungen, sondern es passiert gar nichts.
Lasse ich dagegen das '/^' weg klappt es wunderbar, nur dass er eben anspringt sobald er den Wert in der Option findet und nicht nur am Anfang wie ich es gerne hätte.
Fehlermeldungen erscheinen keine, woran könnte das liegen?

Beispiel für Zweiteres:

o: asss
o: bskd
o. rab

findet rab bei einer Eingabe von a, anstatt asss

vielen Dank

ciao
romy

[Zinny2000]

Hallo,

heute keine Zeit mehr. Werd mich gleich morgen früh über Dein Beispiel hermachen ;-) Meld mich dann wieder hier!

Gruß

Martin

[romy]

Hi,

Die Lösung konnte ich im Archiv ausfindig machen:
http://forum.de.selfhtml.org/archiv/2002/10/25668/#m140453

der neue Code würde dann so aussehen:
var wert = document.kundenauswahl.eingabe2.value;
var count = document.kundenauswahl.kunde.length;
var i = 0;
var bla = new RegExp("^"+wert, "i") //damit gehts

while (i<count){
document.kundenauswahl.kunde.options[i].selected=false;
i++;
}

i=0;
while(i<count) {
var text = document.kundenauswahl.kunde.options[i].text;
if(text.match(bla)) {
document.kundenauswahl.kunde.options[i].selected=true;
break; // nur für den Abbruch nach erstem Fund
}
i++;
}

ciao
romy

[Zinny2000]

Hallo Romy,

vielen, vielen Dank. Hast mir wirklich sehr geholfen, funktioniert prima!

Mein erstes Posting in diesem Forum war also ein voller Erfolg ;-)

Gruß
Martin

PS: Hier mein entgültiges Script:

function suche()
{
var wert = document.jsquickbar.textfeld.value;
var count = document.jsquickbar.JSAuswahl.length;
var i = 0;
var bla = new RegExp("^"+wert, "i") //damit gehts

while(i<count)
{
var text = document.jsquickbar.JSAuswahl.options[i].text;
if(text.match(bla))
{
document.jsquickbar.JSAuswahl.options[i].selected=true;
break; // nur für den Abbruch nach erstem Fund
}
i++;
}
}