Javascript [Radio button]

Hi Mohan,

You have written a right code but the only thing you have missed is that when you are clicking on 'Yes' radio button then you have to hide the second '

' also and when you are clicking on 'No' radio button then you have to hide the first '

' too. I am sharing the code below, please check it:

<html>
<head>head>
<script type="text/javascript">
function yesnoCheck() {
alert('xyz');
if (document.getElementById('yesCheck').checked) {
document.getElementById('ifYes').style.display = 'block';
document.getElementById('ifNo').style.display = 'none';
}
else{
document.getElementById('ifYes').style.display = 'none';
document.getElementById('ifNo').style.display = 'block';
}
}
script>
<body>
Yes <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck">
No <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck"><br>
<div id="ifYes" style="display:none">
If yes, explain: <input type='text' id='yes' name='yes'><br>
What can we do to accommodate you? <input type='text' id='acc' name='acc'>
div>
<div id="ifNo" style="display:none">
What can we do to accommodate you? <input type='text' id='acc' name='acc'>
div>
other 3<input type='text' id='other3' name='other3'><br>
other 4<input type='text' id='other4' name='other4'><br>
body>
html>

1 Reply

Know the answer? Post it — somebody with the same question will find it here.

Deepak Verma8y ago
Hi Mohan,
You have written a right code but the only thing you have missed is that when you are clicking on 'Yes' radio button then you have to hide the second '
' also and when you are clicking on 'No' radio button then you have to hide the first '
' too. I am sharing the code below, please check it:

<html>
<head>head>
<script type="text/javascript">
function yesnoCheck() {
alert('xyz');
if (document.getElementById('yesCheck').checked) {
document.getElementById('ifYes').style.display = 'block';
document.getElementById('ifNo').style.display = 'none';
}
else{
document.getElementById('ifYes').style.display = 'none';
document.getElementById('ifNo').style.display = 'block';
}
}
script>
<body>
Yes <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck">
No <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck"><br>
<div id="ifYes" style="display:none">
If yes, explain: <input type='text' id='yes' name='yes'><br>
What can we do to accommodate you? <input type='text' id='acc' name='acc'>
div>
<div id="ifNo" style="display:none">
What can we do to accommodate you? <input type='text' id='acc' name='acc'>
div>
other 3<input type='text' id='other3' name='other3'><br>
other 4<input type='text' id='other4' name='other4'><br>
body>
html>

0

Javascript [Radio button]

How To Show And Hide Input Fields Based On Radio Button Selection