Quantcast
Channel: Adobe Community : Popular Discussions - ColdFusion
Viewing all articles
Browse latest Browse all 14291

Radio Button javascript onclick show hide textbox

$
0
0
Currently, if the radio button is clicked then text box is shown else if radio button 2 is clicked then textbox is invisible. (only one textbox being shown or being hidden)

I wish to have 2 text boxes

If radio button 1 is clicked then textbox1 is visible
If radio button 2 is clicked then textbox2 is visible.

What changes do I have to do in my code for this to work?

feel free to test this.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function hide() {
var div_ref = document.all("id_div");
div_ref.style.visibility = "hidden";
}

function show() {
var div_ref = document.all("id_div");
div_ref.style.visibility = "visible";
}


</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />



</head>

<body>
<tr>
<td>
Select Device Type <BR>
</td>
<td style="width:200">
<input type="Radio" name="DeviceGroup" value="Radiobutton1" onclick="show();" checked="checked">Radio button 1
<input type="Radio" name="DeviceGroup" value="Radiobutton2" onclick="hide();" unchecked>Radio button 1
</td>
<td>
<div id=id_div style="visibility:hidden;">
Show Textbox1
<input type="Text" name="Textbox1">
</div>
</td>
</tr>

</body>
</html>


Thanks

Viewing all articles
Browse latest Browse all 14291

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>