Ravi Kumar Ravi Kumar - 1 month ago 13
jQuery Question

How to generate tex tboxes automatically if I have 3 radio buttons?

I have 3 radio buttons, when one of them is selected I want to automatically generate textbox . For example, If the user selected the 'Yes' radio button, I want the textbox, and if they select another radio 'No' button it will automatically generate textbox and then I want it to be clear 'yes' textbox. I tried..below is my code..

Can anyone help me??



<html>


<body>
<form name="radios">
<INPUT TYPE=RADIO NAME="X" VALUE="H" onclick="show1();"/>yes
<INPUT TYPE=RADIO NAME="X" VALUE="L" onclick="show();"/>No
<INPUT TYPE=RADIO NAME="X" VALUE="LL" onclick="hide();"/>NA
<TEXTAREA id="area" style="display: none;" NAME="data" ROWS=10 COLS=50></TEXTAREA>
<TEXTAREA id="area1" style="display: none;" NAME="data" ROWS=10 COLS=50></TEXTAREA>
</form>
<script type="text/javascript">
function show1() { document.getElementById('area').style.display = 'block'; }
function show() { document.getElementById('area1').style.display = 'block'; }
function hide() { document.getElementById('area').style.display = 'none'; }
</script>
</body>
</html>




Answer

As per my understanding below code will help you

function show() {
  document.getElementById('area').style.display = 'block';
  document.getElementById('area1').style.display = 'none';
}
function show1() {
  document.getElementById('area1').style.display = 'block';
  document.getElementById('area').style.display = 'none';
}
function hide() {
  document.getElementById('area').style.display = 'none';
  document.getElementById('area1').style.display = 'none';
}

See demo here https://jsbin.com/wogiyoxuhe/edit?html,js,output