webForumDet fria alternativet

Radiobuttons, <div> och onchange

11 svar · 312 visningar · startad av @nders

@ndersMedlem sedan juni 200032 969 inlägg
#1

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,

LeonLMedlem sedan dec. 20025 871 inlägg
#2

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)

PepeJeriaMedlem sedan feb. 2003774 inlägg
#3

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.

PepeJeriaMedlem sedan feb. 2003774 inlägg
#4

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.

@ndersMedlem sedan juni 200032 969 inlägg
#5

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

LeonLMedlem sedan dec. 20025 871 inlägg
#6

Funkar det nu då eller? :o

@ndersMedlem sedan juni 200032 969 inlägg
#7

Nej, det fungerar inte.

SebbeMedlem sedan jan. 20032 285 inlägg
#8

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

if (document.forms['foo'].elements['bar'][5].checked) 
	document.getElementById('extrastuff').style.display='display';
@ndersMedlem sedan juni 200032 969 inlägg
#9

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

Mvh

PepeJeriaMedlem sedan feb. 2003774 inlägg
#10

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>
@ndersMedlem sedan juni 200032 969 inlägg
#11

Det fungerar ju fullkomligt lysande!

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

Mvh,
anders

PepeJeriaMedlem sedan feb. 2003774 inlägg
#12

Bitte! :bire

134 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
129 ms — hämta tråd, inlägg och bilagor (db)