mehrere Dropdown überwachen.

[Arco2726]

Hallo.

Ich hatte schon im HTML Teil die Frage gestellt, wie ich DropDown felder überwachen kann.
Wenn im Dropdown Feld Ja ausgewählt wird, sollte weitere Formularfelder erscheinen.

Das habe ich ja wie folgt gelöst :

<script type="text/javascript">var stat = false;
function dpl(id) {
    if (stat) document.getElementById(stat).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat =  id;
}
</script>

Hierzu muss ich sagen, das ich den über die SuFu von Google gefunden habe.
Für meine zwecke funktionierte es bis jetzt gut.

Dann habe ich im HTML Teil folgendes eingebaut :

Bezahlt :<select name="vgbez" onchange="dpl(this[this.selectedIndex].value)">        
<option value="0">Nein</option>        
<option value="1">Ja</option>
</select>    
<p style="display:none" id="1">    
<select name="vergeb" >    
<option value="46.67">Normaldienst</option>    
<option value="69.67">Sonderdienst</option>    
</select>    
</p>

Jetzt möchte ich aber noch ein zweites DropDown Feld einfügen.

Da möchte ich, wenn Nein ausgewählt wird, drei Weitere Textfelder erscheinen.
Das habe ich wie folgt gemacht :

Abholer = Besitzer :
<select name="abhalt" onchange="dpl(this[this.selectedIndex].value)">        
<option value="2">Ja</option>        
<option value="3">Nein</option></select>    
<p style="display:none" id="3">    
Name :    
<input type="text" name="nameab" />
<br>    
Strasse :    
<input type="text" name="strab" />
<br>
Plz :    
<input type="text" name="plzan" />
<br>    
</p>

Aber nun habe ich das Problem, wenn ich im zweiten DropDown Feld was ändere, das sich das auf das ersten Feld auswirkt.

Was muss ich abändern, damit ich zwei oder mehrer DropDown Felder überwachen kann ?

Gruß

Roland

 

[threadi]

Du hast diesen Absätzen eine ID gegeben die nur aus einer Zahl besteht. Das ist nicht zulässig. Du musst hier IDs verwenden die mit einem Buchstaben beginnen, z.B.

<p id="myfield1">

Dein eigentliches Problem wird jedoch durch diese Funktion verursacht (ich glaube das hatte ich dir auch schon mal gesagt):

function dpl(id) {
    if (stat) document.getElementById(stat).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat =  id;
}

Hier setzt Du bei Ausführung die globale Variable "stat" neu. Wenn Du jetzt im ersten select etwas auswählst, wird hier die ID des betroffenen Feldes gespeichert. Wenn Du dann im zweiten Feld etwas auswählst, wird das Feld mit der ID vom ersten ausführen wieder ausgeblendet. Stimmts?

 

[Arco2726]

Stimmt. Genau das passiert.
Aber ich finde den Fehler nicht :(

Kannst du mir verraten, was ich ändern muss ?

 

[threadi]

Der für dich momentan einfachste Weg dürfte es sein die Funktion zu duplizieren und für jede Feld-Gruppe einzeln zu benennen. Also z.B.:

function dpl1(id) {
    if (stat1) document.getElementById(stat1).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat1 =  id;
}

function dpl2(id) {
    if (stat2) document.getElementById(stat2).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat2 =  id;
}

Die jeweilige Funktion dann nur bei dem betreffenden Element einfügen, statt dpl() derzeit.

Der umfangreichere Weg wäre eine JavaScript-Funktion der man zusätzlich noch ein Objekt/Element übergibt, welches die ein- und auszublendenden Unterauswahlen beinhaltet. Das geht nur mit entsprechendem HTML-Code und erfordert etwas mehr als o.g. Funktion.

 

[Arco2726]

Das hatte ich mir schon fast gedacht.
Ich hatte die Funktion auch schon zweimal eingetragen.
Bei mir sah das nur so aus :

function dpl1(id) 

{    
if (stat) document.getElementById(sta1).style.display = "none";    
document.getElementById(id).style.display   = "";    
stat =  id;
}

function dpl2(id) 

{    
if (stat) document.getElementById(stat).style.display = "none";    
document.getElementById(id).style.display   = "";    
stat =  id;
}

Und um die Funktion in dem Element eizufügen, muss ich doch diesen Teil ändern :

onchange="dpl(this[this.selectedIndex].value)">

nur wie ???

 

[threadi]

Du musst doch nur den anderen Funktionsnamen eintragen. Also statt dpl -> dpl1 bzw. dpl2.

Und die von dir geschriebenen Funktionen sind noch nicht ganz korrekt. Vergleiche mal genau mit meinen oben. Stichwort Variable "stat" ;)

 

[Arco2726]

Guten morgen alle zusammen. Und frohe Ostern.

Ich habe den fehler gefunden. Ist muste noch etwas mehr im JavaScript ändern.
So sieht das ganze nun aus :

<script type="text/javascript">

[B][I][U]var stat1 = false;[/U][/I][/B]  //  <--- Diesen Teil hatte ich bis jetzt NIE geändert !!!

function dpl1(id) {

    if (stat1) document.getElementById(stat1).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat1 =  id;
}
[U][I][B]var stat2 = false;[/B][/I][/U] // <--- Und diesen Teil hatte ich jetzt immer ausgelassen. Deshalb funktionierte es nie !!!

function dpl2(id) {

    if (stat2) document.getElementById(stat2).style.display = "none";
    document.getElementById(id).style.display   = "";
    stat2 =  id;
}
</script>

Und so rufe ich dann die funktionen auf. Hatte das die ganze Zeit abgeändert. Da aber ganz zu anfang der fehler im JavaScript lag, konnte es ja nicht funktionieren.

<select name="vgbez" onchange="dpl1(this[this.selectedIndex].value)">

<select name="abh" onchange="dpl2(this[this.selectedIndex].value)">

Danke dir nochmal. Endlich kann ich weiter machen