[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1974
  • Last Modified:

Javascript Disable Radio Buttons

I am trying to disable a group of Radio Buttons in IE 7.

This is what the html looks like.

<TD style="PADDING-RIGHT: 15px"><INPUT id=123 onclick="" type=radio value=123 name=mode><LABEL for=123>Blue</LABEL></TD>
<TD style="PADDING-RIGHT: 15px"><INPUT id=321 onclick="" type=radio value=321 name=mode><LABEL for=321>Green</LABEL></TD>

In my javascript I have tried....

for (var b = 0; b < mode.length; b++)
          mode[b].disabled = true;

... that did not work at all

I then tried

mode.disabled = true;

.... this at least disabled the first radio button.
0
cophi
Asked:
cophi
  • 2
  • 2
1 Solution
 
basicinstinctCommented:
function disableRadioGrp(name)
{
      var btns = document.getElementsByName(name);
      for(b in btns)
      {
            btns[b].disabled = true;
      }
}

<TD style="PADDING-RIGHT: 15px"><INPUT id=123 onclick="" type=radio value=123 name=mode><LABEL for=123>Blue</LABEL></TD>
<TD style="PADDING-RIGHT: 15px"><INPUT id=321 onclick="disableRadioGrp('mode');" type=radio value=321 name=mode><LABEL for=321>Green</LABEL></TD>
0
 
HonorGodCommented:
Have the group all use the same "name" value, then iterate over the items, and set disabled=true

one moment...
0
 
basicinstinctCommented:
btw - obviously the javascript function needs to go within <script></script> tags (in the <head> section).
0
 
HonorGodCommented:
<html>
<head>
<title>Enable Buttons</title>
<script language='JavaScript' type='text/javascript'>
  function Enable( name, val ) {
    var buttons = document.getElementsByName( name );
    for ( var i = 0; i < buttons.length; i++ ) {
      buttons[ i ].disabled = val;
    }
  }
</script>
</head>
<body>
<table border='1'>
  <tbody>
    <tr>
      <td><input id='r123' onclick='' type='radio' value='123' name='mode'><label for='r123'>Blue</label></td>
    </tr>
    <tr>
      <td><input id='r321' onclick='' type='radio' value='321' name='mode'><label for='r321'>Green</label></td>
    </tr>
  </tbody>
</table>
<form id='myForm' action=''>
  <input type="button" value='Enable'  onclick='Enable("mode",false)' />
  <input type="button" value='Disable' onclick='Enable("mode",true)'/>
</form>
</body>
</html>
0

Featured Post

Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now