[POO] setAttribute() et IE

Version imprimable

Bonjour,
J'ajoute des champs dans un formulaire dynamiquement. J'ajoute sur chaque champ des attributs mais IE ne permet pas d'ajouter n'import lesquels.
Cet exemple fonctionne très bien avec Safari et FF mais pas avec IE6 et IE7

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/HTML; charset=utf-8" />
	<title>Essai</title>
	<script type="text/javascript" src="_javascript/utilitaire.js"></script>
	<script type="text/javascript">
		function ajouter(){
			var select = document.createElement("select");
 
                       //-----------------------------------------------------
                       // Ajout d'attribut
                       //-----------------------------------------------------
			select.setAttribute('onchange','modif();'); //Ne marche pas avec IE
			select.setAttribute('name','select');// Ne pose pas de problème
                       //-----------------------------------------------------
 
			var option1 = document.createElement("option");
			option1.value = "1";
			option1.innerHTML = "option 1";
			var option2 = document.createElement("option");
			option2.value = "2";
			option2.innerHTML = "option 2";
 
			select.appendChild(option1);
			select.appendChild(option2);
			document.getElementById('formulaire').appendChild(select);
		}
		function modif(){
			alert('modif');
		}
	</script>
</head>
<body>
	<?php
                print_r($_POST);
        ?>
	<form action="essai2.php" method="post" id="formulaire">
		<input type="button" name="b1" id="b1" onclick="ajouter();" value="ajouter" />
		<input type="submit" name="b2" id= "b2" value="submit" />
	</form>
</body>
</html>

L'attribut 'name' a bien été ajouter puisqu'une soumission du formulaire affiche bien [select] => n.
Mais l'attribut onchange n'a pas été ajouté (la fonction modif() n'est jamais appelée).
J'ai aussi essayé avec select.onchange = 'select' mais ça ne marche pas non plus.
Des idées?

08/10/2007, 12h42
Shinuza

Salut,

Je pense qu'il faut que tu sépares ton code applicatif (donc la fonction appelée sur le onclick) du reste du code.

La syntaxe que utilise ne fonctionnera pas, il faut faire

Code:

select.onclick = modif
08/10/2007, 13h15
SpaceFrog

Code:

select.onclick = function(){modif();}
08/10/2007, 13h16
Shinuza

Citation:

Envoyé par SpaceFrog

Code:

select.onclick = function(){modif();}

8O Javascript étant un language relativement intelligent, les fonctions sont des objets, donc on peut y faire réference :aie:
08/10/2007, 13h31
SpaceFrog

Je m'attendais à cette réaction de ta part ;)

en l'occurence modif est en effet un objet fonction, et javascript est tout à fait capable de le reconnaitre comme tel.
Je préfère toutefois ma syntaxe car elle est générique et permet d'attribuer aux évènements des fonctions anonymes.
08/10/2007, 14h08
tom42

J'ai donc utilisé

Code:

select.onchange = function(){modif();}

et ça fonctionne avec tous les navigateurs.
Merci beacoup pour vos multiples réponses et votre efficacité.
08/10/2007, 14h14
Shinuza

Encore une victoire de canard pour le niveau du web français :king:

(:?)
08/10/2007, 14h54
SpaceFrog

???
c'est pour moi le canard WC ?

Tu nous fais une crise de tartre ? 8O