Avatar billede mr_mudderkode Nybegynder
27. august 2003 - 14:11 Der er 3 kommentarer og
1 løsning

Disable/enable SELECT boxe afhængigt af RADIO-button valg

Hæj.

Jeg har et antal radioknapper, og ligeså mange select-bokse, og de hører sammen parvis.


---------------- snip --------------------

<form name="form1" action="test.asp" method="post">

<input type="radio" name="rad" value="1" checked>
<select name="select_a">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
<br>
<input type="radio" name="rad" value="2">
<select name="select_b">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

---------------- snip --------------------

Jeg har flere i min form, men dette skulle vel være nok til at illustrere...

På body onload sætter jeg disabled=true på alle select-bokse, undtagen den første, der som default har sin radio button valgt.

Når så en ny radio-button bliver valgt, skal det istedet for være dennes select-boks der kan bruges, og den der forhen kunne bruges skal disables. Det skal altså kun være den select-box ud for den valgte radio-button der skal kunne skiftes.

Hvordan gør jeg det? Den skal både reagere på museklik og på at blive valgt med keyboard.

Jeg fordobler gerne point såfremt nogen leverer en brugbar javascript funktion.
Avatar billede roenving Novice
27. august 2003 - 14:27 #1
Sådan ?-)

<script language="javascript" type="text/javascript">
function enableSel(r){
    var sels = document.getElementsByTagName('SELECT');
    for(i=0;sels.length>i;i++){
        sels[i].disabled = true;
    }
    var ident = String.fromCharCode(96+parseInt(r.value,10));
    document.form1.elements['select_'+ident].disabled = false;
}
</script>
<body onload="enableSel(document.form1.rad[0]);">

<form name="form1" action="test.asp" method="post">

<input type="radio" name="rad" value="1" checked onclick="enableSel(this);">
<select name="select_a">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
<br>
<input type="radio" name="rad" value="2" onclick="enableSel(this);">
<select name="select_b">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
<br>
<input type="radio" name="rad" value="3" onclick="enableSel(this);">
<select name="select_c">
    <option value="1">1</option>
    <option value="2">2</option>
</select>
</form>
</body>
Avatar billede mr_mudderkode Nybegynder
27. august 2003 - 14:32 #2
Jepper. :)
Laver du et svar?
Avatar billede roenving Novice
27. august 2003 - 14:35 #3
Forøvrigt hvad med de værdier som eventuelt måtte være blevet valgt -- skal de ikke resettes ...

-- så skal du tilføje een linje:

    for(i=0;sels.length>i;i++){
        sels[i].disabled = true;
        sels[i].selectedIndex = 0;
    }

-- og velbekomme '-)
Avatar billede roenving Novice
27. august 2003 - 14:45 #4
-- og også tak for points ;~}
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