dynamisch erzeugte (DOM) Radiobuttons funktionieren nicht
Ralph
- javascript
Hallo,
ich hab folgende Datei:
<HTML>
<SCRIPT LANGUAGE="JavaScript">
function addpay()
{
var inp = document.createElement("input");
inp.setAttribute("type", "radio");
inp.setAttribute("name", "Zahlform");
document.getElementById("dynzahlart").appendChild(inp);
}
</SCRIPT>
<BODY>
<INPUT TYPE="radio" NAME="Zahlform">
<DIV ID="dynzahlart"> </DIV>
<A HREF="javascript:addpay()">Radiobutton hinzufügen</A>
</BODY>
</HTML>
Problem: Der neue Radiobutton wird zwar angezeigt, lässt sich im IE6 dann aber nicht auswählen und im NC6 lassen sich beide Radiobuttons auswählen, obwohl es ja immer nur einer sein dürfte, da beide denselben Namen haben.
Eine Unzulänglichkeit von beiden Browsern oder habe ich was falsch gemacht oder geht es evtl. nur ganz anders ??
Danke für Ideen.
<BODY>
<form id="dynzahlart"><INPUT TYPE="radio" NAME="Zahlform"></form>
<A HREF="javascript:addpay()">Radiobutton hinzufügen</A>
</BODY>
</HTML>
so geht's:
die Radio-Buttons in ein <form> stopfen. Dann kann auch gleich das <div> weg und die ID dem Form selbst gegeben werden. (<div> in <form> imho nicht erlaubt). Der modifizierte HTML-Block da oben erfüllt seinen zweck in Mozilla 0.9.9 (wo die alte Version das von die beschriebene Problem hatte) und konqueror 2.2.2 exakt wie gewünscht (was anderes DOM-Fähiges hab' ich hier nit)
gruss Kai
<BODY>
<form id="dynzahlart"><INPUT TYPE="radio" NAME="Zahlform"></form>
<A HREF="javascript:addpay()">Radiobutton hinzufügen</A>
</BODY>
</HTML>
so geht's:
die Radio-Buttons in ein <form> stopfen. Dann kann auch gleich das <div> weg und die ID dem Form selbst gegeben werden. (<div> in <form> imho nicht erlaubt). Der modifizierte HTML-Block da oben erfüllt seinen zweck in Mozilla 0.9.9 (wo die alte Version das von die beschriebene Problem hatte) und konqueror 2.2.2 exakt wie gewünscht (was anderes DOM-Fähiges hab' ich hier nit)
Hi,
Danke im NC gehts jetzt, aber leider noch nicht mit dem IE. Gleiches Problem wie bisher. Jemand noch eine Idee ??
Hallo Ralph
Hi,
Danke im NC gehts jetzt, aber leider noch nicht mit dem IE. Gleiches Problem wie bisher. Jemand noch eine Idee ??
Scheint ein hübscher Bug im IE zu sein. Er verschluckt sich einfach am inp.setAttribute("name", "Zahlform");
einige Alerts zeigen das recht deutlich:
function addpay1()
{
var inp = document.createElement("input");
inp.setAttribute("type", "radio");
inp.setAttribute("name", "Zahlform");
alert(inp.name)
alert(inp.outerHTML)
document.getElementById("dynzahlart").appendChild(inp);
}
Das Namenattribut wird einfach nicht Bestandteil des erzeugten HTML-Objektes. Daher auch das Verhalten des IEs.
Damit geht es dann:
document.getElementById("dynzahlart").insertAdjacentHTML("BeforeEnd",'<input type="radio" name="Zahlform">')
Interessant ist eigentlich auch diese Lösung. Du clonst einfach das erste Element.
function addpay2()
{
if (!document.getElementById("dynzahlart").Zahlform.length)
var myclon=document.getElementById("dynzahlart").Zahlform;
else var myclon=document.getElementById("dynzahlart").Zahlform[0];
document.getElementById("dynzahlart").appendChild(myclon.cloneNode(true))
//alert(document.getElementById("dynzahlart").innerHTML)
}
Nachteil: Verwendest du diese Methode spielt zwar der IE richtig mit, aber dafür verhält sich Netscape 6.2 wie der IE in deiner ursprünglich gewählten Methode.
Viele Grüße
Antje