disableing and enabling form elements with radio buttons

[8ginga8]

Hi every one. I have two radio buttons, yes and no. Then I have some input boxes below. If someone selects yes, they get input box 1, if they select no they get input boxes 2,3,4,5.

I am very new to javascript, can someone please help

 

[8ginga8]

I just tried this and it only worked in firefox for me

onclick="b.disabled=true"
onclick="b.disabled=false

 

[theniteowl]

It sounds more like you want to hide/show the inputs rather than enable/disable them.
Create your radio buttons both with the same name. Create two divs with unique IDs and put your input boxes inside them:

One:<input type="radio" name="R1" value="One" onclick="chgOptions()"> Two:<input type="radio" name="R1" value="Two" onclick="chgOptions()"><br>
<div id="optgrp1" style="display:none;">Option1:<input type="text" name="option1"></div>
<div id="optgrp2" style="display:none;">
  Option2:<input type="text" name="option2"><br>
  Option3:<input type="text" name="option3"><br>
  Option4:<input type="text" name="option4"><br>
  Option5:<input type="text" name="option5"><br>
</div>

The onclick event of the radio buttons points to the chgOptions function below. This function determines which radio button was clicked and toggles the display attribute of the appropriate div.

<script type="text/javascript">
function chgOptions() {
  var myradio = document.getElementsByName('R1');
  if (myradio[0].checked) {

    document.getElementById('optgrp1').style.display = 'inline';
    document.getElementById('optgrp2').style.display = 'none';
  }
  else {
    document.getElementById('optgrp1').style.display = 'none';
    document.getElementById('optgrp2').style.display = 'inline';
  }
}
</script>

Put the script block inside the head of your document.


At my age I still learn something new every day, but I forget two others.