views:

32

answers:

1

I have a web form that has 2 radio buttons, depending on which one is clicked it displays a hidden element

This works fine in all browsers except for IE6, which, after I click on the radio button, I have to click again (anywhere on the window) and then the element is displayed...has anyone had behavior like this before?

I tried to not use jQuery and do straight getElementById() but I get the same behavior...

Javascript

function showHidden(divid) {
  $('#'+divid).css( {'display':'inline'} );
}

HTML

<input type=radio name=borp  value=1 onChange='showHidden("brandchecks")' > Brand
<input type=radio name=borp  value=2 onChange='showHidden("productchecks")' > Product

<div id='brandchecks' style='display:none;'>
Blah
</div>

<div id='productchecks' style='display:none;'>
Blah
</div>
+1  A: 

I thought I remember something about IE firing the onChange event after the focus was lost. This behavior would match what you have seen (ie clicking somewhere else to active your code)

Try to change the onChange in onClick for better results.

Note: To be able to click on the text accompanying the radio buttons you could use the <label> tag, this results in a more user-friendly page.

Veger
great! onClick fixed it. thanks. and also I was always wondering how to make the whole element clickable, didnt even know LABEL existed. really good to know.
JiminyCricket