[js] setAttribute name werkt niet bij form elements in IE6? - Softwareontwikkeling

vrijdag 16 augustus 2002 16:07

Acties:

Topicstarter

Ik probeer dynamisch een formpje te maken, maar in IE6 krijg ik het niet voor elkaar om formelementjes dmv setAttribute een name atribuut te geven.

code:

<html>
<head>
    <title>Untitled</title>
<script>
function writeHer(n) {
  var myForm = document.getElementById('myForm');
  for(i=0;i<n;i++) {
    var myRadio = document.createElement('input');
    myRadio.setAttribute('type', 'radio');
    myRadio.setAttribute('name', 'choose');
    myRadio.setAttribute('value', i);
    myForm.appendChild(myRadio);
    //myForm.elements[i].name = 'choose';
  }
}
</script>
</head>

<body onLoad="writeHer(12);">
<form id="myForm"></form>
<p><a href="javascript:alert(document.body.innerHTML);">show</a></p>
</body>
</html>

Als je het linkje 'show' klikt zie je dat hij het name atrribuut niet toevoegt. In NS6 werkt het wel.

Ook als ik het probeer met myForm.elements[i].name = 'choose'; werkt het niet (zie het ge-quote regeltje).

Heeft iemand een makkelijke oplossing hiervoor?

vrijdag 16 augustus 2002 16:15

Acties:

crisp

Devver

Pixelated

Je kan voor IE het beste gewoon:

code:

var myRadio = document.createElement('input');
myRadio.type = 'radio';
myRadio.name =  'choose';
myRadio.value = i;
myForm.appendChild(myRadio);

doen; setAttribute wordt volgens mij nog niet ondersteund door IE...

Intentionally left blank

vrijdag 16 augustus 2002 16:25

Acties:

2

Topicstarter

crisp schreef op 16 augustus 2002 @ 16:15:
Je kan voor IE het beste gewoon:
code:
1
...
doen; setAttribute wordt volgens mij nog niet ondersteund door IE...

Het wordt wel ondersteund (zie http://www.xs4all.nl/~ppk/js/version5.html) en op zich werkt het ook prima (behalve bij event-attributes dan) alleen blijkbaar mag je het name attribuut niet veranderen; jouw oplossing werkt namelijk ook niet.

vrijdag 16 augustus 2002 17:17

Acties:

Verwijderd

name is read-only, voor zover ik weet. Misschien kun je beter id gebruiken.

zondag 18 augustus 2002 17:58

Acties:

2

Topicstarter

Id werkt ook niet, maar ik heb een oplossing gevonden. Je kan gewoon in createElement al een name attribute meegeven:

code:

function writeHer(n) {
  var myForm = document.getElementById('myForm');
  for(i=0;i<n;i++) {
    var myRadio = document.createElement('<input name="choose"/>');
    myRadio.setAttribute('type', 'radio');
    myRadio.setAttribute('value', i);
    myForm.appendChild(myRadio);
  }
}

Zie ook: http://msdn.microsoft.com...nce/properties/name_2.asp

Ik snap alleen niet helemaal waarom name niet gewoon door setAttribute veranderd kan worden.

zondag 18 augustus 2002 19:09

Acties:

Verwijderd

2 schreef op 18 augustus 2002 @ 17:58:
Id werkt ook niet, maar ik heb een oplossing gevonden. Je kan gewoon in createElement al een name attribute meegeven:
code:
1
    var myRadio = document.createElement('<input name="choose"/>');

Dan wil ik je er wel even op wijzen dat dit weer een eigen verzinsel is van Microsoft, die lijnrecht tegen het Document Object Model ingaat. Dat is in dit geval nog eens ectra waardeloos, doordat DOM zich niet beperkt tot HTML pagina's. De DOM specificaties staan erg duidelijk vermeld op w3.org, en Microsoft lapte de regels weer eens aan zijn laars omdat ze dachten dat dit wel handig zou zijn.

createElement is er om een Element node te maken, zonder attribute nodes. En met als argument ook alleen een naam, en geen haakjes eromheen. De enige juiste syntax is de volgende: document.createElement('input'), zoals je in je eerste stuk code gelukkig ook had.

En de name attribute hoor je ook wel degelijk te kunnen setten met DOM methoden.

Het is wel erg raar dat die name wel degelijk een waarde krijgt, maar dat die niet gebruikt wordt, of iets dergelijks:

code:

1	alert(myRadio.attributes['name'].value);

Op zich lijkt dit me een bug, of de heren IE developers moeten het bewust zo gedaan hebben. In het laatste geval zijn ze IMHO niet slim beziggeweest.

zondag 18 augustus 2002 19:56

Acties:

2

Topicstarter

cheatah, je hebt natuurlijk helemaal gelijk, en het lijkt me duidelijk dat dit een soort workaround is eerder dan dat ze het zo bedoeld hebben. Ik zie er iig geval geen voordeel in maar wel veel nadeel.

Je ziet ook dat bijvoorbeeld netscape 7 dit er van maakt:

code:

1	<<input name="choose" /> type="radio" value="1">

zondag 18 augustus 2002 23:59

Acties:

crisp

Devver

Pixelated

Een id setten lukt me toch wel op deze manier:

code:

1
2
3

var oDiv = document.createElement('div');
oDiv.id = 'box' + i;
document.body.appendChild(oDiv);

in IE trouwens niet op deze manier, die wel prima werkt in Mozilla:

code:

1	oDiv.setAttribute('id', 'box'+i);

Er is dus duidelijk iets stuk in IE; ik nam hierop aan dat IE setAttribute helemaal niet ondersteunde, maar dat blijkt dus niet helemaal waar te zijn.
Nog een alternatief die volgens mij in IE ook niet werkt:

code:

1
2
3

var s = document.createAttribute('id');
s.value = 'box' + i;
oDiv.setAttributeNode(s);

Intentionally left blank

maandag 19 augustus 2002 01:40

Acties:

jurriaan

hmm als ik deze code gewoon plat in een html pagina zet en bekijk met IE6 werkt dat prima. Zowel met myRadio.setAttribute('name') als met myRadio.name = '';

code:

<html>
<body>

<form name=myForm>
</form>

<script type="text/javascript" language="Javascript">
<!--
    var myRadio = document.createElement('input');
    myRadio.type = 'radio';
    //myRadio.name =  'choose';
    myRadio.setAttribute('name', 'choose');
    myRadio.value = 1;
    myRadio.onfocus = function () { alert(this.name);};
    myForm.appendChild(myRadio);

    alert(document.myForm.elements[0].name);

//-->
</script>

</body>
</html>

Wees verantwoordelijk voor je eigen daden

maandag 19 augustus 2002 08:21

Acties:

crisp

Devver

Pixelated

Mmmz, ik ben nu even de draad kwijt; zal vanavond nog eens wat dingetjes gaan testen. Ik werk ook nog veel met IE5.5, dus misschien dat een deel van mijn voorgaande opmerkingen nog daarop gebaseerd waren...

Intentionally left blank