Safari Dynamic Radios Test Case

Email: calophi AT gmail DOT com

These scripts work in the latest versions of IE, Mozilla, and Opera.

The script uses document.createElement() to create a radio button. It sets the name, type, id, and value using the traditional formula (, radio.value, etc.) except for the "name" in IE, which is set using IE's invalid createElement() format since IE is silly with dynamic naming. The radio is the appended to the div using appendChild(). It also pops in a label for good measure.

Here's a shortened version of the script:

var theRadio = (IE5) ? document.createElement("<input name=RadiosONE>") : document.createElement("input");

theRadio.type = "radio"; = theRadio.value = "Radio_" + ctr;
if(!IE5) = "RadiosONE";


Add a radio button or two, then go ahead and alert the innerHTML.

Where the heck is the "type" and "name" under Safari??

Radios go under me (name=RadiosONE).

Apparently for type and name, Safari needed to use "setAttribute()" instead of doing "" and "radio.type". I have no idea why, but that seems to make it work okay. However... now the radios don't seem to realize they belong to the same radio group in Safari!

Again, the shortened code:

var theRadio = (IE5) ? document.createElement("<input name=RadiosTWO>") : document.createElement("input");
if(!IE5) theRadio.setAttribute("name","RadiosTWO");
theRadio.setAttribute("id","Radio_" + ctr);


After creating some radio buttons you should be able to select each one individually - yet the alert will show you they all have the same name.

Radios go under me (name=RadiosTWO).


I figured out why it wasn't working. Apparently Safari is most displeased with the lack of <form> tags around the radio buttons. However, even WITH those tags, the top example still does not set the name and type, which I think is a serious issue anyway.

Radios go under me (name=RadiosONECOPY).

I am fully functional. Radios go under me (name=RadiosTWOCOPY).