Drop-Liste

Status
Nicht offen für weitere Antworten.

thobikid

Grünschnabel
Also ich wollte mir sowas machen wie auf dieser Seite:

Seite

Also nur die Drop-Liste oben
Die macht das so, dass wenn man vorne was anwählt sich bei der 2. was ändert.
und sowas wollte ich auch machen, jedoch ich als (fast) gimp habe noch kA wie ich das hinbekomm ^^

Bye Thobikid
 
Achso und nochwas.
Wenn man dann bei der 2. Liste was auswählt ändert sich die Seite darunter das wüsst ich auch gerne, wie man das macht :D
Wäre nett, wenn mir jmd. sagen kann, wie das geht.
schon im vorraus
 
Das wäre dann mit javascript zu programmieren!
In HTML geht das nicht.
Du änderst die 1. Dropliste und durch den Eventhandler OnChange (in dem eine Javascriptfunktion aufgerufen wird) wird die 2 gändert.
Genauso funktioniert das mit der 2. zur Tabelle.

Nur wäre der Code für mich jetzt zu komplex als das ich ihn schnell mal schreiben könnte.
 
Hier mal ein Ansatz ( kein fertiges Script ), hatte den CodeSchnipsel grad noch rumliegen, weil ich gerade etwas ähnliches scripte....

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script language="JavaScript1.2" type="text/javascript">
sub_auswahl_1 = new Array
(
"Piratenschiff",
"Abenteuerinsel"
)
sub_auswahl_2 = new Array
(
"Puppenhaus",
"Kaufladen"
)
function tausche()
{
if(document.forms.eingabe.erste.options[1].selected == true)
{
x = document.forms.eingabe.ausgabe.length
if(document.forms.eingabe.ausgabe.length !=  0)
		{ 
		var Zaehler = 0;
			while(Zaehler != x)
			{
			document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length-1] = null;
			Zaehler++;	
			}
a = new Option(sub_auswahl_1[0]);
b = new Option(sub_auswahl_1[1]);
document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length] = a;
document.forms.eingabe.ausgabe[0].value = "Zement"
document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length] = b;
document.forms.eingabe.ausgabe[1].value = "Beton"
d = document.forms.eingabe.ausgabe
alert(d[0].value + d[1].value)
return false;
}
}
if(document.forms.eingabe.erste.options[2].selected == true)
{
x = document.forms.eingabe.ausgabe.length
if(document.forms.eingabe.ausgabe.length !=  0)
		{ 
		var Zaehler = 0;
			while(Zaehler != x)
			{
			document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length-1] = null;
			Zaehler++;	
			}
c = new Option(sub_auswahl_2[0]);
d = new Option(sub_auswahl_2[1]);
document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length] = c;
document.forms.eingabe.ausgabe.options[document.forms.eingabe.ausgabe.length] = d;
return false;
}
}
return false
}

</script>
</head>
<body>
<form name="eingabe">
<select name="erste" size="1" onchange="tausche()">
<option selected value="leer">&nbsp;&nbsp;&nbsp;</option>
<option value="Lego">Lego</option>
<option value="Lego">Playmobil</option>
</select>

<select name="ausgabe" size="1">
<option value="">Test 1</option>
<option value="">Test 2</option>
<option value="">Test 3</option>
</select>

</form>
</body>
</html>
 
Dafür einmal ein großes Dankeschön. Nun hab ich aber nochmal ne Frage, und zwar, ob man das für die 1. Auswahl auch machen kann.
Nun ist es ja so, dass sobald man etwas von der 1. Liste ausgewählt hat, und man wieder auf den leere Kasten zrückklickt, dass dann das im 2. Kasten stehen bleibt, was man eingtestellt hat. Das will ich net. Ich will, dass wenn man auf das leere Kästchen klickt, wieder der Anfangszustand ist. Naja falls das jmd kapiert, was ich da eben geschrieben hab kann mir auch hoffendlich sagen, ob man das machen kann oder nicht und wenn ja wie man das umgestalten muss.
Großes Dankeschön schon im Voraus
 
Status
Nicht offen für weitere Antworten.
Zurück