Element-Index ermitteln und in Onchange-Event übergeben

[gizzy]

Hallo,

ich habe eine Seite in der es mehrere Auswahllisten mit dem gleichen Namen gibt. Sie haben jeweils ein OnChange-Event mit Funktionsaufruf:

<select name=ende style="width:100%" onchange="i=1; checkvalue(document.fff.ende[i][document.fff.ende[i].selectedIndex].value,document.fff.start[i][document.fff.start[i].selectedIndex].value,i,false);">

Im Beispiel weise ich dem Index "i" den festen Wert 1 zu. Aber wie kann ich den Index für dieses Element ermitteln?

Gruß
gizzy

[Cheatah]

Hi,

Im Beispiel weise ich dem Index "i" den festen Wert 1 zu. Aber wie kann ich den Index für dieses Element ermitteln?

wozu brauchst Du den? An keiner Stelle ist ein Index von Nöten. Verwende einfach 'this'.

Cheatah

[gizzy]

wozu brauchst Du den? An keiner Stelle ist ein Index von Nöten. Verwende einfach 'this'.

hm, aber ich möchte in der Funktion in Anhängigkeit vom Index eine Aktion ausführen und auch auf andere Select-Elemente zugreifen. Also brauche ich doch den Index?!

[LX]

hm, aber ich möchte in der Funktion in Anhängigkeit vom Index eine Aktion ausführen und auch auf andere Select-Elemente zugreifen. Also brauche ich doch den Index?!

Nein, Du brauchst lediglich das Element, dessen Inhalt Du testen möchtest. Das Element kannst Du innerhalb von onchange mit "this" übergeben, wie Cheatah es Dir vorgeschlagen hat, also in etwa:

<select ... onchange="checkSelect(this);">

CheckSelect bekommt damit das Select-Feld als Node übergeben, so dass Du in der Funktion den Wert ermitteln kannst:

function checkSelect(field) {  
   var value = field.options[field.selectedIndex].value;  
   ...  
}

Gruß, LX

[gizzy]

Nein, Du brauchst lediglich das Element, dessen Inhalt Du testen möchtest. Das Element kannst Du innerhalb von onchange mit "this" übergeben..

aber ich meine nicht den Index der gewählten Option, sondern den Index des Select-Elements.
Also ich habe z.B. mehrere Select-Elemente mit dem dem Namen "Ende" und auch "Start". Das es die Elemente mehrfach gibt wird doch automatisch ein Index angelegt, richtig?
Verändere ich nun z.B Ende[1] soll in der Funktion der Wert von Ende[1] und Start[1] verglichen und gegebenfalls geändert werden.

function checkvalue(Ende,Start,Index,First)
{
if (Number(Ende) <= Number(Start))
    {
    alert("Ende-Wert muss über Start-Wert liegen!");
    if (First==true)
        {
        document.fff.start[Index].selectedIndex=document.fff.ende[Index].selectedIndex - 1;
        }
    else
        {
        document.fff.ende[Index].selectedIndex=document.fff.start[Index].selectedIndex + 1;
        }
    }
}

Damit die Funktion weiss auf welche Elemente sie sich beziehen soll, brauch sie doch einen Index?!
Oder habe ich noch einen anderen Denkfehler drin bzw. die falsche Umsetzung gewählt?

[LX]

Den Index kannst Du ermitteln, indem Du das DOM traversierst (durchgehst): document.getElementsByTagName('select') gibt alle selects zurück. In einer for-Schleife kannst Du nun vergleichen, welches Feld mit welchem index mit "this" identisch ist.

Gruß, LX

[gizzy]

Den Index kannst Du ermitteln,....

Ich habe es jetzt noch anders gelöst. Ich vergebe neben dem Namen fürs Select-Element auch noch eine ID.

<select name="ende" id=0 style="width:100%" onchange="checkSelect(this);">

In der Funktion frage ich dann diese ID ab.

function checkSelect(field) {
Index = field.options.id;

.
.
.
.
}

Somit habe ich beim Funtkionsaufruf nur das 'this' und kann in der Funktion dann auch leicht die einzelenen ende(bzw start)-Select-Elemente unterscheiden.

Weiss nicht ob das so "sauber" ist, aber es funktioniert:)

[JürgenB]

Hallo gizzy,

<select name="ende" id=0 style="width:100%" onchange="checkSelect(this);">

IDs dürfen nicht mit einer Nummer anfangen. Was spricht denn gegen vernünftige IDs, z.B. Start0, Ende0, Start1, Ende1, ... und dann Zugriff über getElementById?

Eine andere Möglichkeit wäre, den Elementen eine Nummer als "Attribut" per Javascript zu geben:

field.options.nummer = 0;

Da DOM-Elemente in Javascript auch nur Objekte sind, kann man sie so beliebig erweitern. Im HTML wäre aber <select nummer="0" ... nicht valide.

Auch der verschachtelte Einsatz von getElementById und getElementsByTagName könnte dein Problem lösen.

Gruß, Jürgen

[ChrisB]

Hi,

<select name="ende" id=0 style="width:100%" onchange="checkSelect(this);">

In der Funktion frage ich dann diese ID ab.

function checkSelect(field) {
Index = field.options.id;

Weiss nicht ob das so "sauber" ist, aber es funktioniert:)

Das wuerde mich doch wundern.
Wieso greifst du denn erst mal auf options unterhalb des Selects zu, und suchst dort nach einer ID?

MfG ChrisB

[gizzy]

Wieso greifst du denn erst mal auf options unterhalb des Selects zu, und suchst dort nach einer ID?

das habe ich gestern dann auch noch gesehen das es ein wenig seltsam ist....habe dann auch festgestellt das es nur im InternetExplorer klappt. Nicht aber im Firefox.

Ohne "options":  "var Index = field.id" klappt es auch im Firefox. Aber nachdem Hinweis von Jürgen werde ich es so auch nicht lassen (kein reiner Zahlenwert als ID).

Gruß
gizzy

[Struppi]

Den Index kannst Du ermitteln,....

Ich habe es jetzt noch anders gelöst. Ich vergebe neben dem Namen fürs Select-Element auch noch eine ID.

Ich denke mal, dass beste wäre - wenn du wirklich diesen Weg gehen musst - dir eine Helperfunktion zu bauen, die den Index ermittelt.

function getIndex(el) {  
   // hat das Formular mehrere Elemente mit dem Namen  
   var elements = el.form[el.name];  
   if(!elements.length) return null;  
   for(var i = 0; i < elements.length; i++) if(el == elements[i]) return i;  
   return null;  
}  

Die musst du dann eben immer aufrufen, wenn du den Index ermitteln möchtest.

function checkSelect(field) {
Index = field.options.id;

function checkSelect(field) {  
   var index = getIndex(field);  

Globale Variabeln solltest du immer vermeiden und ein grosser Anfangsbuchstabe symbolisiert eine Konstruktorfunktion, deshalb sollten alle normalen Variabeln mit einem Kleinbuchstaben beginnen.

Struppi.

[Cheatah]

Hi,

hm, aber ich möchte in der Funktion in Anhängigkeit vom Index eine Aktion ausführen und auch auf andere Select-Elemente zugreifen. Also brauche ich doch den Index?!

wenn Du das wirklich meinst, dann durchlaufe die Liste der entsprechenden Formular-Elemente und vergleiche, ob sie mit dem aktuellen Element identisch sind.

Cheatah

[Peter Pan]

Hi!

hm, aber ich möchte in der Funktion in Anhängigkeit vom Index eine Aktion ausführen und auch auf andere Select-Elemente zugreifen. Also brauche ich doch den Index?!

wenn Du das wirklich meinst, dann durchlaufe die Liste der entsprechenden Formular-Elemente und vergleiche, ob sie mit dem aktuellen Element identisch sind.

Das war jetzt echt fies;)

off:PP