---
title: "Radiobuttons, <div> och onchange"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/79502-radiobuttons-div-och-onchange"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "@nders"
published: "2003-06-12T12:39:43.000Z"
updated: "2003-06-12T13:22:42.000Z"
replies: 11
views: 318
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/79502-radiobuttons-div-och-onchange"
---

# Radiobuttons, <div> och onchange

## #1 — @nders, 2003-06-12T12:39Z

Hej!

Jag har ett formulär, som innehåller sex radioknappar, en av dessa har en onchange-eventhandler. Formuläret ser ut så här:

```
<form name="foo" id="foo">
  <input type="radio" name="bar" id="bar" value="1">
  <input type="radio" name="bar" id="bar" value="2">
  <input type="radio" name="bar" id="bar" value="3">
  <input type="radio" name="bar" id="bar" value="4">
  <input type="radio" name="bar" id="bar" value="5">
  <input type="radio" name="bar" id="bar" value="6" onchange="checkValue();">
</form>
```

Jag har ett \<div\>-block som ser ut så här:

```
<div name="extrastuff" id="extrastuff" style="display:none;">
  <!-- lite ditten och datten här -->
</div>
```

Jag vill, att när den sista radioknappen markeras, eller avmarkeras, ska följande funktion köras:

```
<script>
function checkValue() {
  if (document.forms['foo'].elements['bar'][5].checked) 
	document.getElementById('extrastuff').style.display='';
  else
	document.getElementById('extrastuff').style.display='none';
}
</script>
```

Jag testade först att använda getElementById i min if-sats i funktionen också, men det ville inte alls fungera. Fel gjorde jag nog. ;)
Koden gör följande i IE6:
 \* Ingenting när man markerar radioknappen med värde 6.
 \* Visar min \<div\> när man avmarkerar knappen.

Koden gör detta i Mozilla:
 \* Visar min \<div\> när man markerar knappen (rätt!)
 \* Ingenting när man avmarkerar / väljer en annan radioknapp.

Jag har dock skrivit denna kod direkt ur skallen, för det är för mycket skräp och märkliga saker i originalkoden, det skulle ta för lång tid att rensa. Det har dock tyvärr medfört att ovan kod inte verkar fungera alls. ;)
Men förhoppningsvis förstår någon vad jag vill göra, och kanske kan hjälpa en serverkille att pilla till så klienten förstår vad jag menar. ;)

Mvh och tpf,

Permalänk: https://www.webforum.nu/p/79502

## #2 — LeonL, 2003-06-12T12:42Z

if (document.forms\['foo'\].elements\['bar'\]\[5\].checked=true)

?

red\\ då bör Else-satsen vara så här:
elseif (document.forms\['foo'\].elements\['bar'\]\[5\].checked=false)

Permalänk: https://www.webforum.nu/p/1081727

## #3 — PepeJeria, 2003-06-12T12:45Z

Bara en fråga, varför har du både name o id i elemeten? 
I ditt fall använder du enbart name för checkboxarna och id för div o annat.

Permalänk: https://www.webforum.nu/p/1081732

## #4 — PepeJeria, 2003-06-12T12:46Z

Eller för att vara mer tydlig, ett id i ett dokument måste vara unikt. Något som då inte stämmer i checkboxarna.

Permalänk: https://www.webforum.nu/p/1081735

## #5 — @nders, 2003-06-12T12:48Z

> **PepeJeria skrev:**
>
> Bara en fråga, varför har du både name o id i elemeten?

Ingen aning, men det ser inte riktigt ut så i originalkoden. ;) 

> I ditt fall använder du enbart name för checkboxarna och id för div o annat.

Okay, men det blev (kanske inte helt oväntat) någon funktionalitetsförändring med de ändringarna.

LeonL: nej, någon elseif behövs inte, det duger bra med en else. ;)

Mvh

Permalänk: https://www.webforum.nu/p/1081741

## #6 — LeonL, 2003-06-12T12:51Z

Funkar det nu då eller? :o

Permalänk: https://www.webforum.nu/p/1081746

## #7 — @nders, 2003-06-12T12:52Z

Nej, det fungerar inte.

Permalänk: https://www.webforum.nu/p/1081748

## #8 — Sebbe, 2003-06-12T13:05Z

Funkar det kanske bättre såhär?

```
if (document.forms['foo'].elements['bar'][5].checked) 
	document.getElementById('extrastuff').style.display='display';
```

Permalänk: https://www.webforum.nu/p/1081764

## #9 — @nders, 2003-06-12T13:07Z

Nej, tyvärr. "Could not get the display property. Invalid argument."

Mvh

Permalänk: https://www.webforum.nu/p/1081767

## #10 — PepeJeria, 2003-06-12T13:08Z

Du menar något i denna stil?

```
<form name="foo">
  <input type="radio" name="bar" value="1">
  <input type="radio" name="bar" value="2">
  <input type="radio" name="bar" value="3">
  <input type="radio" name="bar" value="4">
  <input type="radio" name="bar" value="5">
  <input type="radio" name="bar" value="6">
</form>

<div id="extrastuff" style="display:none;">
  Synligt när sista radio-button är checkad
</div>

<script type="text/javascript">
var form = document.forms["foo"];

for(var i=0; i<form.bar.length; i++)
{
	form.bar[i].onclick = checkValue;
}

function checkValue() 
{
	document.getElementById('extrastuff').style.display = (this.checked && this.value == 6)? "":"none";
}
</script>
```

Permalänk: https://www.webforum.nu/p/1081772

## #11 — @nders, 2003-06-12T13:20Z

Det fungerar ju fullkomligt lysande!

Tack så alldeles infernaliskt mycket för hjälpen! :D :D :D

Mvh,
anders

Permalänk: https://www.webforum.nu/p/1081776

## #12 — PepeJeria, 2003-06-12T13:22Z

Bitte!  :bire

Permalänk: https://www.webforum.nu/p/1081778

---

Tråden på webben: https://www.webforum.nu/amne/javascript/79502-radiobuttons-div-och-onchange