IE9, radio buttons and DIVs

I’m just getting back into some development of Online Time Clock MTS and had the pleasure of squashing an annoying bug today that was only appearing on IE9. I used the prototype javascript library pretty heavily in the development of this online system and getting the value of a group of radio buttons is something of a pain but can be done like this:

var selected_value = Form.getInputs('form_name','radio','radio_group_name').find(function(radio) { return radio.checked; }).value;

This returns the value of the selected radio button of the group you’re interested in. Works perfectly until you go and put a <DIV> </DIV> in the middle of your HTML radio buttons. Then IE9 decides that the radio buttons AFTER the div are no longer part of the radio group. The above javascript will then throw an exception if one of the radio buttons after the offending DIV is selected. The simple fix (for me at least) was to change the <DIV> to a <SPAN>

This entry was posted in Software on by .

About markn

Mark is the owner and founder of Timesheets MTS Software, an mISV that develops and markets employee timesheet and time clock software. He's also a mechanical engineer, father of four, and a lifelong lover of gadgets.