Radio buttons and :onchange

Hi all,

I have three radio buttons that when clicked are supposed to show a
particular div and hide other divs, pretty straight forward. But what I
have noticed is that while the code works perfectly in Chrome and
Firefox it breaks down in IE 7 & 8. Here is the code:

<%= radio_button_tag( :synch, :div_1, @account.div_1 == true ? true :
false, :onchange => 'new Effect.Fade(\'div2_check\'); new
Effect.Appear(\'div1_check\');' ) %>

<%= radio_button_tag( :synch, :div_2, @account.div_2 == true ? true :
false, :onchange => 'new Effect.Fade(\'div1_check\'); new
Effect.Appear(\'div2_check\');' ) %>

<%= radio_button_tag( :synch, :none, (@account.div_1 == false and
@account.div_2 == false) ? true : false, :onchange => 'new
Effect.Fade(\'div1_check\'); new Effect.Fade(\'div2_check\');' ) %>

<div id = "div1_check" style = "<% if !@account.div_1 %> display:none;<%
end %>border: 1px solid black;">
....
</div>

<div id = "div2_check" style = "<% if !@account.div_2 %> display:none;<%
end %>border: 1px solid black;">
...
</div>

When the page loads and I click on one of the radio buttons it's almost
as if the first click isn't "heard", and when I click a different radio
button a div is shown but not the div that I clicked, instead the
previous div is show from the "unheard" click.

Really I'm just wondering if anybody has encountered a similar problem
and how they fixed it if they have. I have been looking at mis-matched
tags with no luck. IE is giving me a JavaScript error at the bottom, but
I am a little suspicious of this just because all other browsers fail to
give a similar error and work as designed.

Have you checked the html syntax by copying the full html of the page
(View, Page source or similar in browser) and pasting into the w3c
html validator (google it if necessary). Often differences between
browsers are due to them interpreting invalid html differently. Not
necessarily in this case of course but worth checking.

Colin

Colin Law wrote: