Radio button group problems (IE)
I have a form with radio buttons (select "yes"/"no").
These are in sections, which can be cloned/removed using jquery.
The problem with IE is that
all the radio buttons end up in one group where only one can be checked at the same time, across the sections!!
With Chrome/FF it works fine, but not with IE.
I use the following code to give the input elements of each section a unique name.
-
cloned_section.find('[name]').each(function(){
$(this).attr('name', $(this).attr('name') + '_ary[' + sectionid + ']');
});
sectionid++;
Although the radio buttons initially have the same name (in the cloned template), they get unique names using the code above (confirmed), so I do not understand why it does not work!
It looks like IE radio button behaviour are based on the original DOM where all the radio buttons have the same name, and does not reflect the DHTML name changes.
Is this an IE bug? Known workarounds?
Update: It looks like this is a known problem, some attributes can not be changed dynamically at run time in IE. The workaround are browser specific methods for creating elements, but that would not work in my code,as I am .clone()ing a section...
http://www.thunderguy.com/semicolon/200 ... -explorer/
http://stubblog.wordpress.com/2008/05/0 ... namically/
So how can I solve this problem without having to build every section manually, and use browser detection?
Thanks for your help!!