...

View Full Version : Javascript hide check box answer



cimm.mann
05-26-2009, 05:11 PM
Hi,

I have got so close to finishing this stupid form... I know there isnt a onunclick method. But when I click the check box the answer appears. When i click of it, it does not disapear....

can anyone please help me!

thanks


<IMG src="/ukassets/images/75/CM%20new%20template/index_r2_c1.jpg" border=0>
<style type="text/css">
#container {
width: 650px;
margin: -12px;
text-align: right;
background: #ffffff;
border: 0px #000000 solid;
}
div.inpane, div.outpane {
background: #ffffff;
border: 1px #003399 solid;
padding: 15px;
margin: 15px;
font: normal 11px verdana;
}
div.inpane {
position: relative;
display: block;
}
div.outpane {
position: relative;
display: none;
}
select {
width: 120px;
}
input.rad, input.box {
position: relative;
top: 3px;
}
</style>


<script type = "text/javascript">

function showNext(which) {
document.getElementById(which).style.display="block";
}
</script>

<div id="container">
<div id ="firstname" class="inpane">
First name:<input type = "text" name="firstname" onclick = "showNext('lastname')">

</div>

<div id ="lastname" class="inpane">
Last name: <input type = "text" name="lastname" onclick = "showNext('emailaddress')">
</div>

<div id ="emailaddress" style=display:block class="inpane">
Email: <input type = "text" name="emailaddress" onclick = "showNext('modules')">
</div>

<div id="modules" class="inpane">
Which Modules are you interested in?<br><br>
Dynamic Content<input class="rad" name="dynamic content" type="checkbox" value="yes" onclick = "showNext('dynamic')"><br>
Deep Tracking<input class="rad" name="deep tracking" type="checkbox" value="yes" onclick = "showNext('deep')"><br><br>
<img src="/ukassets/images/75/CM%20new%20template/continue.jpg" width="80" height="25" alt="" border="0">
</div>

<div id="dynamic" style=display:none class="outpane">
How often would you use dynamic content?<br><br>
Once a month<input class="rad" name="frequencydc" type="checkbox" value="1month" onclick = "showNext('a1')"><br>
Twice a month<input class="rad" name="frequencydc" type="checkbox" value="2month" onclick = "showNext('a2')"><br>
Three times a month<input class="rad" name="frequencydc" type="checkbox" value="3month" onclick = "showNext('a3')"><br>
Four times a month<input class="rad" name="frequencydc" type="checkbox" value="4month" onclick = "showNext('a4')"><br><br>
<img src="/ukassets/images/75/CM%20new%20template/continue.jpg" width="80" height="25" alt="" border="0">
</div>

<div id="deep" style=display:none class="inpane">
How often would you use deep tracking?<br><br>
Once a month<input class="rad" name="frequencydt" type="radio" value="1month" onclick = "showNext('b1')"><br>
Twice a month<input class="rad" name="frequencydt" type="radio" value="2month" onclick = "showNext('b2')"><br>
Three times a month<input class="rad" name="frequencydt" type="radio" value="3month" onclick = "showNext('b3')"><br>
Four times a month<input class="rad" name="frequencydt" type="radio" value="4month" onclick = "showNext('b4')"><br><br>
<img src="/ukassets/images/75/CM%20new%20template/continue.jpg" width="80" height="25" alt="" border="0">
</div>

<div id="a1" style=display:none class="inpane">
<h3>Once a month</h3><br>
This might be 100 per go, this is just an example of text</div>

<div id="a2" style=display:none class="inpane">
<h3>Twice a month</h3><br>This might be 200 per go, this is just an example of text</div>

<div id="a3" style=display:none class="inpane">
<h3>Three times a month</h3><br> -This might be 300 per go, this is just an example of text</div>

<div id="a4" style=display:none class="inpane">
<h3>Four Times a month a month</h3><br> -This might be 400 per go, this is just an example of text</div>

<div id="b1" style=display:none class="inpane">
<h3>Once a month</h3><br>
This might be 100 per go, this is just an example of text</div>

<div id="b2" style=display:none class="inpane">
<h3>Twice a month</h3><br>This might be 200 per go, this is just an example of text</div>

<div id="b3" style=display:none class="inpane">
<h3>Three times a month</h3><br> -This might be 300 per go, this is just an example of text</div>

<div id="b4" style=display:none class="inpane">
<h3>Four Times a month a month</h3><br> -This might be 400 per go, this is just an example of text</div>


<div id="final" class="inpane">
<input type="submit" value="Submit">
</div>

Philip M
05-26-2009, 05:28 PM
Use this in place of your function showNext():-


function Toggle(which) {
var Style = document.getElementById(which).style;
Style.display = (Style.display == "none") ? "block" : "none";
}


The Moving Finger writes; and, having writ,
Moves on: nor all your piety nor wit
Shall lure it back to cancel half a line,
Nor all your tears wash out a word of it.

-- Omar Khayyam

cimm.mann
05-26-2009, 05:34 PM
this doesnt work, i keeps coming up with a error.

I replaced the shownext function with what you told me and changed all the shownext's in the code to toggle.

is this correct?

sorry philip

Philip M
05-26-2009, 06:42 PM
What error? It ought to work. It is the same as your showNext() function only adapted to toggle the display.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum