Please what is wrong with this code?

tito

The code below supposed to display/hide a <TR> when a radio button is selected. However I have a problem: when I click on the second one (no), it works as designed and hides. However, when you click back on the first one (yes), it displays as designed BUT the 'no' radio button is still checked and you have to click on 'yes' again.
In other words you have to click on 'yes' twice. While it gained focus, that does not reflect in the radio state.

<script type="text/JavaScript">
function shownav(theTable)
{
     obj = document.getElementsByTagName('TR');
       for (i=0; i<obj.length; i++)
     {
            if (obj[i].id == theTable)
          obj[i].style.display = '';
     }
}
function hidenav(theTable)
{
      obj = document.getElementsByTagName('TR');
       for (i=0; i<obj.length; i++)
     {
            if (obj[i].id == theTable)
          obj[i].style.display = 'none';
     }
}
</script>

html

<tr>
<td>Display Navigation?</td>
<td align="center"><input checked type="radio" name="navigation" value="1" onfocus="shownav('magnav');return true;" />
Yes</td>
<td align="center" class="mag_alt2">No 
<input class="bginput" type="radio" name="navigation" value="0" onfocus="hidenav('magnav');return false;" />
</td>
</tr>
<TR width="100%" id="magnav" style="display: visible;">
<td width="100%" colspan="3><strong>Navigation</strong></td>
</td>
</tr>

Weedpacket

I notice that in one of the radio buttons you have the onfocus handler (why not the onclick handler?) returning true, while in the other it returns false. Any particular reason for this? Returning true means that the event continues on to any further handlers that are attached; returning false means it doesn't.

That said, the code you posted doesn't put the page into an inconsistent state (two radio buttons with the same name both checked) for me.

tito

Thanks
what I did is use the onclick event for the true and the onfocus for false. That seems to hold it but if it set to false, and I refresh the page, then all I was hiding displays while the false button is checked. I am no javascript expert, all I did was a search on the net and found that code.