Avatar billede tahoo Nybegynder
02. marts 2006 - 15:36 Der er 6 kommentarer og
1 løsning

drop down med onchange

Hej Eksperten

Jeg har på en side lavet 4 drop down menuer:
(list1, list2, list3, list4 i alle kan man vælge 23cm, 33cm, 42cm)


kode kan ses her:
<form name="form1" method="post" action="test.asp">
<p>

    <select name="list1">
      <option value="2">23 cm</option>
      <option value="3">33 cm</option>
      <option value="4">42 dm</option>
    </select>

</p><p>

    <select name="list2">
      <option value="2">23 cm</option>
      <option value="3">33 cm</option>
      <option value="4">42 dm</option>
    </select>

</p><p>

    <select name="list3">
      <option value="2">23 cm</option>
      <option value="3">33 cm</option>
      <option value="4">42 dm</option>
    </select>

</p><p>

    <select name="list4">
      <option value="2">23 cm</option>
      <option value="3">33 cm</option>
      <option value="4">42 dm</option>
    </select>

</p>
</form>


Hvordan gør jeg så følgende..


- Hvis man i list1 vælger 42 cm
- Må man kun kunne vælge 42 eller 33 cm i list2
- Så igen alt efter hvad man vælger i list2, skal list3 tilpasse sig..
  - 1.) Vælger man 42 cm i list2, må man i list3 vælger 42 eller 33 cm
  - 2.) Vælger man 33 cm i list2, må man i list3 vælger 33 eller 23 cm
        - 1.) Vælger man 33 cm i list3, må man i list4 vælge 33 eller 23 cm
        - 2.) Vælger man 23 cm i list3, må man i list4 kun vælge 23 cm
       

Man kan sige dette er fælles:

list1 vil altid være >= list2, list2 vil altid være >= list3, list3 vil altid være >= list4

Dog må man ikke "springe" 2 nogle steder..

d.v.s, er:
list1 = 42, må man ikke vælge 23 i list2
eller
list2 = 42, må man ikke vælge 23 i list3


Jeg er bedste til asp, men for at løse dette skal vi vist have noget javascript..

Håber virkelig nogle kan hjælpe..
Avatar billede softspot Forsker
02. marts 2006 - 15:39 #1
Prøv at kigge på roenving's demosite: http://roenving.users.whitehat.dk

Det er under #4 i menuen til venstre.
Avatar billede mclemens Nybegynder
04. marts 2006 - 10:21 #2
Sådan her?

<script language="javascript">
function menuit(idname){
a4="<option value=\"4\">42 dm</option><option value=\"3\">33 cm</option>";
a3="<option value=\"3\">33 cm</option><option value=\"2\">23 cm</option>";
a2="<option value=\"2\">23 cm</option>";

for(mcx=idname;mcx<4;mcx++){
document.getElementById("list"+(mcx+1)).outerHTML="<select name=\"list"+(mcx+1)+"\"

id=\"list"+(mcx+1)+"\"

onChange=\"menuit("+(mcx+1)+")\">"+eval("a"+document.getElementById("list"+mcx).value)+"</select>

";}}
</script>


<form name="form1" method="post" action="test.asp">
<p>
    <select name="list1" id="list1" onChange="menuit(1);">
<option value="4">42 dm</option>
<option value="3">33 cm</option>
<option value="2">23 cm</option>
    </select>
</p><p>
    <select name="list2" id="list2" onChange="menuit(2);">
<option value="4">42 dm</option>
<option value="3">33 cm</option>
<option value="2">23 cm</option>
    </select>
</p><p>
    <select name="list3" id="list3" onChange="menuit(3);">
<option value="4">42 dm</option>
<option value="3">33 cm</option>
<option value="2">23 cm</option>
    </select>
</p><p>
    <select name="list4" id="list4" onChange="menuit(4);">
<option value="4">42 dm</option>
<option value="3">33 cm</option>
<option value="2">23 cm</option>
    </select>
</p>
</form>
Avatar billede mclemens Nybegynder
04. marts 2006 - 10:23 #3
Scriptet blev adskilt :/
... Har lige samlet det (ind under head)

<script language="javascript">
function menuit(idname){
a4="<option value=\"4\">42 dm</option><option value=\"3\">33 cm</option>";
a3="<option value=\"3\">33 cm</option><option value=\"2\">23 cm</option>";
a2="<option value=\"2\">23 cm</option>";
for(mcx=idname;mcx<4;mcx++){document.getElementById("list"+(mcx+1)).outerHTML="<select name=\"list"+(mcx+1)+"\"id=\"list"+(mcx+1)+"\"onChange=\"menuit("+(mcx+1)+")\">"+eval("a"+document.getElementById("list"+mcx).value)+"</select>";}}
</script>

...samt form fra ovenstående
Avatar billede mclemens Nybegynder
04. marts 2006 - 10:34 #4
Udvidet/forbedret scriptet lidt..

<script language="javascript">
function menuit(idname){
a4="<option value=\"4\">42 dm</option><option value=\"3\">33 cm</option>";
a3="<option value=\"3\">33 cm</option><option value=\"2\">23 cm</option>";
a2="<option value=\"2\">23 cm</option>";

for(mcx=idname;mcx<4;mcx++){
mcheck=document.getElementById("list"+(mcx)).value;
if((document.getElementById("list"+(mcx+1)).value>mcheck)||(document.getElementById("list"+(mcx+1)).value<(mcheck-1))){
document.getElementById("list"+(mcx+1)).outerHTML="<select name=\"list"+(mcx+1)+"\" id=\"list"+(mcx+1)+"\" onChange=\"menuit("+(mcx+1)+")\">"+eval("a"+document.getElementById("list"+mcx).value)+"</select>";}}}
</script>
Avatar billede tahoo Nybegynder
04. marts 2006 - 11:47 #5
Perfekt, jeg siger mange tak... - så er der nogle jeg kan arbejde videre på :o)
Avatar billede tahoo Nybegynder
04. marts 2006 - 11:47 #6
kan du så få lavet det svar > mclemes :o)
Avatar billede mclemens Nybegynder
04. marts 2006 - 12:13 #7
svar ;)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester