Jacascript: Habe ein Problem , wer kann helfen ?

Routinier

Dabei seit: 10.01.2011

Sonntag, 26. Juni 2011, 23:13

Hallo ,

Wer kann mir bei einem Javascriptproblem helfen ?
Ich habe 3 Listfelder , die immer abhängig von dem davorgehenden Listenfeld gefüllt werden sollen.

Soweit bin ich schon

http://jegi.eu/test.html

Die ersten beiden Boxen funktionieren schon , aber die 3 Box bekomme ich nicht hin.
Hier der Code.

Spoiler
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<html>
<head>
<title>Java-Script + Form + Select</title>
<script language="JavaScript">

var daten1_box2 = new Array(); 
daten1_box2[0]="Opel"; 
daten1_box2[1]="VW"; 
daten1_box2[2]="BMW"; 
daten1_box2[3]="AUDI";

var daten2_box2 = new Array(); 
daten2_box2[0]="Karotten"; 
daten2_box2[1]="Kohlrabi"; 
daten2_box2[2]="Thomaten"; 
daten2_box2[3]="Gurken";

var daten1_box3 = new Array(); 
daten1_box3[0]="Vectra"; 
daten1_box3[1]="Astra"; 
daten1_box3[2]="Kadett"; 
daten1_box3[3]="Tigra";


function box() { 
auswahl=document.Maske.Auswahl1.value;

if (auswahl==1) { 
for (i=0;i<4;i++) {
 eintrag= new Option(daten1_box2[i]);
 document.Maske.Auswahl2.options[i]=eintrag;

}
}

if (auswahl==2) { 
for (i=0;i<4;i++) 
{
 eintrag= new Option(daten2_box2[i]);
 document.Maske.Auswahl2.options[i]=eintrag;
}
}

}

function box2() { 
auswahl=document.Maske.Auswahl2.value;

if (auswahl==1) { 
for (i=0;i<4;i++) {
 eintrag= new Option(daten1_box3[i]);
 document.Maske.Auswahl3.options[i]=eintrag;
}
}

if (auswahl==2) { 
for (i=0;i<4;i++) 
{
 eintrag= new Option(daten2_box3[i]);
 document.Maske.Auswahl3.options[i]=eintrag;
}
}

}

</script>
</head>
<body >
<h1>Testbox</h1>
<Form name="Maske" action="xxx"> 

Warengruppe 

<SELECT name="Auswahl1" size="10" onChange=box() >
<OPTION value=1>Autos</OPTION>
<OPTION value=2>Gemüse</OPTION>
<OPTION value=3>Handys</OPTION>
<OPTION value=4>Trinken</OPTION>
</SELECT>

<SELECT name="Auswahl2" size="10" onChange=box2() >

</SELECT>

<SELECT name="Auswahl3" size="10">

</SELECT>

<br>

<Input type="button" name="Fertig" value="Fertig"  > </form></body></html>

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »jegi0605« (26. Juni 2011, 23:13)

lorenz

Haudegen

Dabei seit: 05.11.2002

Beiträge: 647

Sonntag, 26. Juni 2011, 23:48

du guckst in box2() nach dem value der select boxen die haben aber keine und damit ist der value = der textwert. Da du aber nicht danach abfragst wird die if abfrag nie true. Um options values hinzuzufügen musst du sie danach setzen.

	Javascript-Quelltext
1	eintrag= new Option(daten1_box2[i],value);

wenn deine funktion also zb so aussehen würde müsste es gehen auch wenn der Ansatz den du da gehst vermutlich für ein fertiges Produkt nicht sonderlich clever ist, aber zum üben bringt das sicher was

Javascript-Quelltext

function box() { 
auswahl=document.Maske.Auswahl1.value;

if (auswahl==1) { 
for (i=0;i<4;i++) {
 eintrag= new Option(daten1_box2[i],i);
 document.Maske.Auswahl2.options[i]=eintrag;

}
}

if (auswahl==2) { 
for (i=0;i<4;i++) 
{
 eintrag= new Option(daten2_box2[i],i);
 document.Maske.Auswahl2.options[i]=eintrag;
}
}

}

-LA

jegi0605

Routinier

Dabei seit: 10.01.2011

Beiträge: 259

Montag, 27. Juni 2011, 06:14

Hey danke ,

Werde ich gleich mal Probieren.
Wenn es elegantere Lösungen dafür gibt , immer her damit ;-)

ospx

Kaiser

Dabei seit: 11.11.2006

Beiträge: 1 131

Montag, 27. Juni 2011, 16:43

[spam]
Hey, so eine Z3-Gurke oder einen Tomaten-Passat finde ich eine sehr coole Sache. :w00t:

siehe: http://jegi.eu/test.html
[spam]

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »ospx« (27. Juni 2011, 16:43)

jegi0605

Routinier

Dabei seit: 10.01.2011

Beiträge: 259

Montag, 27. Juni 2011, 21:58

Finde ich auch COOL ,

Nein , mal im Ernst sind natürlich nur Testdaten.
Wen es Interessiert , habe es jetzt anderst gelöst.

Einfach mal den Sourcecode anschauen

http://jegi.eu/test1.html