Log in

View Full Version : Forms


Liam
08-14-2009, 07:51 AM
Hello every one.

Im a bit stuck with some code. The code below lets the user click on a radio button if they click on No then another radio button appears. I want to know if there is a way of adding extra code so if you click on the radio button that appears when you click no more radio buttons appear.

I have tried a number of things but nothing is working the way I want it.

Any help would be great.

Thanks


<html>
<head>
<title>Hide/Show textarea</title>
<script language="JavaScript">
function showhide(radval,divid)
{
if(radval=="no")
{document.getElementById(divid).style.visibility="visible"}
if(radval=="yes")
{
document.getElementById(divid).style.visibility="hidden"
document.myform.txta.value="Enter your reason here"
}
}
</script>
</head>
<body>
<form name="myform">
<input type="radio" name="rad" value="yes" onclick="showhide(this.value,'divtxta')">Yes<br>
<input type="radio" name="rad" value="no" onclick="showhide(this.value,'divtxta')">No
<div id="divtxta" style="visibility:hidden;">

<label>
<input type="radio" name="radio" id="txta" value="txta">
</label>
</div>
</form>
</body>
</html>
forum_amnesiac
08-14-2009, 11:16 AM
I'm not sure I understand what you're trying to do.

I have tried your code in IE7 and it works as expected, select No and another button appears.

I have clicked on the new button and I don't get any other buttons appearing.

You do have a problem with the new button.

You set its value differently in HTML to the javascript.
Liam
08-15-2009, 07:09 AM
You do have a problem with the new button.

You set its value differently in HTML to the javascript.

what is the problem with the new button?

secondly what i want is when the new button appears when you click on that another hidden button appears. Hope that makes sense
forum_amnesiac
08-15-2009, 08:18 AM
This lets you have another hidden button after the first one, is that what you wanted.


<html>
<head>
<title>Hide/Show textarea</title>
<script language="JavaScript">
function showhide(radval,divid)
{
if(radval=="yes")
{
document.getElementById(divid).style.visibility="hidden"
} else {
document.getElementById(divid).style.visibility="visible"
}
}
</script>
</head>
<body>
<form name="myform">
<input type="radio" name="rad" value="yes" onclick="showhide(this.value,'divtxta')">Yes<br>
<input type="radio" name="rad" value="no" onclick="showhide(this.value,'divtxta')">No
<div id="divtxta" style="visibility:hidden;">

<label>
<input type="radio" name="radio" id="txta" value="txta" onclick="showhide(this.value,'divtxtb')">
</label>
</div>
<div id="divtxtb" style="visibility:hidden;">

<label>
<input type="radio" name="radio" id="txtb" value="txtb">
</label>
</div>
</form>
</body>
</html>

As to the problem with setting the value of the first hidden button this is what I mean. in your code you have these 2 lines.


document.myform.txta.value="Enter your reason here" - in the function


<input type="radio" name="radio" id="txta" value="txta" onclick="showhide(this.value,'divtxtb')"> - in the body

In the function you are setting a value and you are setting a different value in the HTML
Liam
08-16-2009, 12:05 PM
Thanks. That worked and is just what i needed.

Many thanks :D