03. august 2003 - 23:25
Der er
12 kommentarer og 1 løsning
Valg af radio-knap definerer options i en dropdownmenu
Forestil jer, at man har 4 radioknapper og en enkelt dropdownmenu ved siden af. Afhængigt af hvilken radioknap man vælger, skal dropdownmenuen have forskellige menupunkter (i stedet for flere dropdownmenuer). Desuden skal den tilhørende form submittes når man vælger et menupunkt i dropdownmenuen Hvordan ville man lave det i javascript?
Annonceindlæg fra Thales
03. august 2003 - 23:40
#1
Her er lidt kode at arbejde med: Hvis man vælger Metode skal option 5-6 også med, og hvis man vælger tutorgruppe skal option 5-10 med. Ellers bare 1-4 <form name="gruppehold"> <table border="0" width="250" align="center"><tr><td width=100% align="left"> <fieldset><legend>Vælg tutorgruppe eller øvelseshold</legend> <table border="0"><tr><td width="170" align="right"> <label for="tutorgr">Tutorgruppe</label> <input type="radio" name="radio" value="tutorgr" id="tutorgr" onclick="document.gruppehold.nummer.disabled = false"> <br> <label for="ovhold">Almen Sociologi</label> <input type="radio" name="radio" value="almen" id="almen" onclick="document.gruppehold.nummer.disabled = false"> <br> <label for="ovhold">Danske Samfund</label> <input type="radio" name="radio" value="danske" id="danske" onclick="document.gruppehold.nummer.disabled = false"> <br> <label for="ovhold">Metode</label> <input type="radio" name="radio" value="metode" id="danske" onclick="document.gruppehold.nummer.disabled = false"> <br> <select name="nummer" id="nummer" disabled> <option value="">Vis alle</option> <option value="1">Hold 1</option> <option value="2">Hold 2</option> <option value="3">Hold 3</option> <option value="4">Hold 4</option> <option value="5">Hold 5</option> <option value="6">Hold 6</option> <option value="7">Hold 7</option> <option value="8">Hold 8</option> <option value="9">Hold 9</option> <option value="10">Hold 10</option> </select> </td></tr></table> </fieldset> </td></tr><table> </form>
03. august 2003 - 23:58
#2
Hedder de virkelig det samme ?-)
04. august 2003 - 00:00
#3
Altså Hold 1,2 osv ...
04. august 2003 - 00:08
#4
Ja, hvert fag/gruppe har flere hold tilknyttet, og når man har valgt fag/gruppe i radio-delen er det jo underforstået at det er fx. Almen, Hold 1 man vælger
04. august 2003 - 00:11
#5
Men som sagt: Pointen er, at hver fag/gruppe har et forskelligt ANTAL hold tilknyttet, så derfor skal bruger kun have fire valgmuligheder, hvis han vælger Almen sociologi eller Danske Samfund, men han skal have 10 valgmuligheder, hvis han vælger tutorgrupper... - burde man stille det op på en anden måde, synes du...?
04. august 2003 - 00:16
#6
Sådan ?-) option 5-10 med. Ellers bare 1-4 --> <script language="javascript" type="text/javascript"> function changeNummer(n){ sel = document.gruppehold.nummer; sel.length = 0; opt = document.createElement('OPTION'); sel.appendChild(opt); opt.value = ""; opt.text = "Vis alle"; for(i=1;n>=i;i++){ opt = document.createElement('OPTION'); sel.appendChild(opt); opt.value = "" + i; opt.text = "Hold " + i; } } </script> <form name="gruppehold"> <table border="0" width="250" align="center"><tr><td width=100% align="left"> <fieldset><legend>Vælg tutorgruppe eller øvelseshold</legend> <table border="0"><tr><td width="170" align="right"> <label for="tutorgr">Tutorgruppe</label> <input type="radio" name="radio" value="tutorgr" id="tutorgr" onclick="changeNummer(10);document.gruppehold.nummer.disabled = false"> <br> <label for="almen">Almen Sociologi</label> <input type="radio" name="radio" value="almen" id="almen" onclick="changeNummer(4);document.gruppehold.nummer.disabled = false"> <br> <label for="danske">Danske Samfund</label> <input type="radio" name="radio" value="danske" id="danske" onclick="changeNummer(4);document.gruppehold.nummer.disabled = false"> <br> <label for="metode">Metode</label> <input type="radio" name="radio" value="metode" id="metode" onclick="changeNummer(6);document.gruppehold.nummer.disabled = false"> <br> <select name="nummer" id="nummer" disabled> </select> </td></tr></table> </fieldset> </td></tr><table> </form>
04. august 2003 - 00:18
#7
Fik nok lige fjernet for mange options i start-positionen, så denne skal nok være der fra starten: <option value="">Vis alle</option>
04. august 2003 - 00:20
#8
Skulle virke fra IE5 og NS6 -- og alle nyere browsere ...
04. august 2003 - 00:23
#9
Hæng på - jeg prøver.....
04. august 2003 - 00:36
#10
Det var satans.... :-)) Det virker perfekt, og når man sender resultaterne til en anden side og requester dem, kommer de smukt frem som de skal! Hvis du giver mig et svar skal du få nogle point. Jeg har dog en finte jeg gerne ville have med: Kan du lave det sådan, så formen automatisk submitter, når man vælger hold i dropdownmenuen...?
04. august 2003 - 00:41
#11
Ja, den sætter vi på en onchange på selecten, der skal jo altid ændres værdi !-) <select name="nummer" id="nummer" disabled onchange="this.form.submit();"> <option value="">Vis alle</option> </select> Hvis du ellers skal have valideret onsubmit, skal så kaldes før den submit-funktion kaldes, altså f.eks. onchange="valider(this.form);this.form.submit();" -- og velbekomme '-)
04. august 2003 - 00:49
#12
Smukt arbejde! Jeg forstod dog ikke din kommentar 00:18:13 - det virker fint nok som jeg ser det....
04. august 2003 - 01:07
#13
Jeg havde fjernet dummyen også, og det ser lidt mærkeligt ud, at den starter med at være smal, det er jo nok, at den er disabled indtil der er noget i !-) -- og tak for points ;~}
Vi tilbyder markedets bedste kurser inden for webudvikling