Avatar billede sijmonj Nybegynder
04. oktober 2009 - 15:56 Der er 1 kommentar og
1 løsning

dropdown box

Hej jeg har et problem med at lave sådan at når man trykker på en bestemt kategori i min dropdown menu så skal der komme en ekstra dropdown menu ved siden af, har prøvet med det her

<select name="kategori" id="kategori">
    <option value="0">Vælg kategori</option>
    <option value="guldkorn">Guldkorn</option>
    <option value="jokes">Jokes</option>
    <option value="kerlighed">Kærlighed</option>
    <option value="astrologi" onchange="document.getElementById('box2').style.visibility='visible');">Atrologi</option>
    <option value="motion">Motion/Kost</option>
</select>

<div id="box2" style="visibility:hidden;">
<select name="horoskoper" id="horoskoper">
    <option value="0">Vælg Horoskoper</option>
    <option value="vedder">Vædder</option>
    <option value="tyr">Tyr</option>
    <option value="tvilling">Tvilling</option>
    <option value="krebs">Krebs</option>
    <option value="jomfru">Jomfru</option>
    <option value="vagt">Vægt</option>
    <option value="skorpin">Skorpion</option>
    <option value="skytte">Skytte</option>
    <option value="stenbuk">Stenbuk</option>
    <option value="vandbarer">Vandbærer</option>
    <option value="fisk">Fisk</option>
   
</select>
</div><!-- box2 -->

en virker ikke :(
Avatar billede tjens Nybegynder
04. oktober 2009 - 16:32 #1
Onchange hører til på selecten.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script>
function setBox2(kVal) {
    if (kVal.indexOf('astrologi') > -1)
        document.getElementById('box2').style.visibility='visible';
    else
        document.getElementById('box2').style.visibility='hidden';

}
</script>
</head>
<body>
<div>
<select name="kategori" id="kategori" onchange="setBox2(this.value)">
    <option value="0">Vælg kategori</option>
    <option value="guldkorn">Guldkorn</option>
    <option value="jokes">Jokes</option>
    <option value="kerlighed">Kærlighed</option>
    <option value="astrologi"">Astrologi</option>
    <option value="motion">Motion/Kost</option>
</select>
</div>
<div id="box2" style="visibility:hidden;">
<select name="horoskoper" id="horoskoper">
    <option value="0">Vælg Horoskoper</option>
    <option value="vedder">Vædder</option>
    <option value="tyr">Tyr</option>
    <option value="tvilling">Tvilling</option>
    <option value="krebs">Krebs</option>
    <option value="jomfru">Jomfru</option>
    <option value="vagt">Vægt</option>
    <option value="skorpin">Skorpion</option>
    <option value="skytte">Skytte</option>
    <option value="stenbuk">Stenbuk</option>
    <option value="vandbarer">Vandbærer</option>
    <option value="fisk">Fisk</option>
</select>
</div>
</body>
</html>
Avatar billede ebusiness Nybegynder
04. oktober 2009 - 16:43 #2
Et lidt mere generelt svar, læg mærke til at jeg har valgt at bruge display attributten i stedet for visibility, på den måde kan flere forskellige mulige select bokse stå på samme sted.

<select name="kategori" id="kategori" onchange="for(var i=1;i<6;i++) document.getElementById('box'+i).style.display='none';document.getElementById('box'+this.selectedIndex).style.display='';">
    <option value="0">Vælg kategori</option>
    <option value="guldkorn">Guldkorn</option>
    <option value="jokes">Jokes</option>
    <option value="kerlighed">Kærlighed</option>
    <option value="astrologi">Atrologi</option>
    <option value="motion">Motion/Kost</option>
</select>
<br>
<select id="box1" style="display:none;"></select>
<select id="box2" style="display:none;"></select>
<select id="box3" style="display:none;">
    <option value="0">Vælg Horoskoper2</option>
    <option value="vedder">Vædder</option>
    <option value="tyr">Tyr</option>
    <option value="tvilling">Tvilling</option>
    <option value="krebs">Krebs</option>
    <option value="jomfru">Jomfru</option>
    <option value="vagt">Vægt</option>
    <option value="skorpin">Skorpion</option>
    <option value="skytte">Skytte</option>
    <option value="stenbuk">Stenbuk</option>
    <option value="vandbarer">Vandbærer</option>
    <option value="fisk">Fisk</option>
</select>
<select name="horoskoper" id="box4" style="display:none;">
    <option value="0">Vælg Horoskoper</option>
    <option value="vedder">Vædder</option>
    <option value="tyr">Tyr</option>
    <option value="tvilling">Tvilling</option>
    <option value="krebs">Krebs</option>
    <option value="jomfru">Jomfru</option>
    <option value="vagt">Vægt</option>
    <option value="skorpin">Skorpion</option>
    <option value="skytte">Skytte</option>
    <option value="stenbuk">Stenbuk</option>
    <option value="vandbarer">Vandbærer</option>
    <option value="fisk">Fisk</option>
</select>
<select id="box5" style="display:none;"></select>
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