This is due to a problem of wrong implementation of DOM in IE. I've
corrected a bit of your code and it works perfectly in NS6+.
> -----Message d'origine-----
> De : lilia lopez [mailto:lilialopez47@h...]
> Envoy=C3=A9 : dimanche 12 janvier 2003 00:26
> =C3=80 : javascript
> Objet : [javascript] creating radio buttons dynamically
>
>
> hi,
> I'm creating new input fields for a dynamic form. I'm including radio
> buttons. I'm displaying it, but when I try to select the
> radio, it is not
> selected, how can I correct this problem?
> this is an example:
>
> <html>
> <head>
>
> <title>Create Table</title>
> </head>
> <script>
>
> __uid =3D 0;
Don't forget to use var here to avoid problem.
> doc =3D document;
Same here.
> function addRowTo(id) {
> var tbl =3D doc.getElementById(id);
>
> // create a new row
> var newrow =3D doc.createElement("TR");
>
> var
> newcol,newinput,newcol1,newinput1,newcol2,newinput2,newcol3,ne
> winput3,newco
> l4,newinput4,newcol5,newinput5;
> var newoption, newoption1, newSelect;
>
> newcol =3D doc.createElement("TD");
> newinput =3D doc.createElement("INPUT");
> newinput.type =3D "radio"
> newinput.name =3D "KEY"+__uid;
> newinput.value =3D "R"+__uid;
> newcol.appendChild(newinput);
> newrow.appendChild(newcol);
These radio buttons don't have the same name, they can never act as
mutually exclusive radio buttons. If I were you, I would just use
newinput.name =3D "KEY";
> newcol1 =3D doc.createElement("TD");
> newinput1 =3D doc.createElement("INPUT");
> newinput1.name =3D "NAME"+__uid;
> newcol1.appendChild(newinput1);
> newrow.appendChild(newcol1);
>
> newcol2 =3D doc.createElement("TD");
> newinput2 =3D doc.createElement("SELECT");
> newoption =3D doc.createElement("OPTION");
> newoption.text =3D "varchar";
> newoption.value =3D "1";
> newinput2.add(newoption);
This add() method expects TWO parameters. If you want to append,
use
newinput2.add(newoption, null);
http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID
-942
82980
However, this is where the problem is found in IE. When there're
two parameters in this line, IE will complain of "type mismatch" in
previous
line !! This is because in Micro$oft's DOM, the second parameter is
expected to be an integer !
http://msdn.microsoft.com/library/default.asp?url=3D/workshop/author/dht
ml/ref
erence/methods/add.asp
> newoption1 =3D doc.createElement("OPTION");
> newoption1.text =3D "integer";
> newoption1.value =3D "2";
> newinput2.add(newoption1);
Same problem here.
I haven't read the following lines of code because I've tested your
code with my corrections in NS6+ and it worked perfectly, so it's a
problem
in IE and I don't think I could correct MS Bug=C2=AE any further
Good luck debugging in MSIE :-)
> newcol2.appendChild(newinput2);
> newrow.appendChild(newcol2);
>
>
> newcol3 =3D doc.createElement("TD");
> newinput3 =3D doc.createElement("INPUT");
> newinput3.name =3D "TYPE"+__uid;
> newcol3.appendChild(newinput3);
> newrow.appendChild(newcol3);
>
> newcol4 =3D doc.createElement("TD");
> newinput4 =3D doc.createElement("INPUT");
> newinput4.type =3D "CHECKBOX"
> newinput4.name =3D "FNULL"+__uid;
> newinput4.value =3D "C1"+__uid;
> newcol3.appendChild(newinput4);
> newrow.appendChild(newcol4);
>
> newcol5 =3D doc.createElement("TD");
> newinput5 =3D doc.createElement("INPUT");
> newinput5.type =3D "CHECKBOX";
> newinput5.name =3D "UNIQUE"+__uid;
> newinput5.value =3D "C2"+__uid;
> newcol5.appendChild(newinput5);
> newrow.appendChild(newcol5);
>
>
>
> tbl.appendChild(newrow);
>
> __uid++;
> }
>
> </script>
>
> </head>
> <body>
>
> <form name=3D"mainform" method=3D"get" action=3D"">
>
> <table id=3D"tbl1" cellSpacing=3D"0" cellPadding=3D"0" width=3D"100%"
> border=3D"0">
>
> <tbody id=3D"tbl1body">
>
> </tbody></table>
> </body>
>
> <input id=3D"submit" type=3D"submit" value=3D"submit" /><br />
> </form>
>
> <input type=3Dbutton value=3D"ADD" onclick=3D"addRowTo('tbl1body');">
> </html>
View Cart
