erreur causée par la méthode appendChild() avec IE

Version imprimable

Bonjour à tous,
J'ai un probleme sous IE6 en utilisant la méthode appendChild(objet).
J'ai testé sous firefox et chrome et sa marche sauf que avec IE (6,7 et 8) je suis bloqué.
Voici mon code:
Code:

1 2 3 4 5 6 7 8 9 pic = new Image(); pic.id = "img_thumb_"+id; //pic.name = "img_thumb_"+id; pic.src = "get_mini_image.php?archId="+id; pic.style.display = "block"; pic.style.position = "absolute"; pic.style.top = "10%"; pic.style.left = "64%"; parent.document.getElementById("table_principal").appendChild(pic);
Merci d'avance pour votre aide.

Salut.

Essaye en ajoutant les styles après l'insertion :

Code:

1
2
3
4
5
6
7
8
9
pic = new Image();
pic.id = "img_thumb_"+id;
//pic.name = "img_thumb_"+id;
pic.src = "get_mini_image.php?archId="+id;
parent.document.getElementById("table_principal").appendChild(pic);
pic.style.display = "block";
pic.style.position = "absolute";
pic.style.top = "10%";
pic.style.left = "64%";

02/12/2009, 23h03
hastiok

Je vois pas pour qu'elle raison le responsable du développement web du developpez.com s'en fout de ma gueule.
C'est très respectueux de ta part Monsieur !!!
03/12/2009, 08h12
Bovino

8O
Il faut voir à arrêter un peu la parano et comprendre que pour IE, positionner en absolute un élément qui n'est pas insérer dans le DOM peut être problématique, ce que je te propose de contourner en affectant le style (donc le positionnement) une fois ton élément ajouté dans le DOM.
03/12/2009, 08h16
vermine
Bonjour,

Je vois que vous prenez l'id "table_principal" (il y a une faute d'orthographe mais passons), je suppose donc que vous vous accrochez à une balise:
Code:

1 2 <table id="table_principal">
Peut-être devez-vous attacher l'élément à une cellule du tableau ?
Code:

1 2 3 4 5 6 <table id="table_principal"> <tr> <td id="cellule_principale"></td> </tr> </table>
03/12/2009, 08h44
SpaceFrog

Oui je trouve aussi que cela relève de la paranoïa ... :roll:
Bovino tente juste d'aider ...

Bref !

Tu essayes d'insérer dans une balise table ?
N'ayant pas le html on ne peut que le supposer au vu de l'id ...
Il faut alors appender dans le thead ou tbody du table, et même si dans ton code html tu ne l'as pas précisé, pour IE ils existent

Bonjour messieurs,
Je vous remercie pour vos répliques qui m'ont données des nouvelles pistes...mais toujours sans aucune résultat.
Pour mieu vous exposer le probleme je vous fournit le code du tableau parent [Composant auquel je lui applique le appendChild]:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<table class="table_navigation_principale"  >
		<tbody id="table_principal">
		<tr>
			<!--<td class="td_navigation_principale" id="ttRich" style="width:310px; border-right: 1px solid #D9DEE2;">-->
			<td class="td_navigation_principale" id="ttRich" style="width:230px;">
			..............	
			</td>
			<!--<td class="td_navigation_principale" style="width:100px; text-align:right; padding-right:10px; border-right: 1px solid #D9DEE2;">-->
			<td class="td_navigation_principale" style="width:100px; text-align:right; padding-right:10px;">	
             ................			
			</td>
			<td class="td_navigation_principale" style="width:120px;">
			.................
			</td>
		</tr>
		<tr >
	<tr >
 <td colspan="3" style="padding:0px;" valign="top" visibility="visible" >
   ...................
</td>
</tr>
</tbody>
	</table>

Merci d'avance pour votre aide

04/12/2009, 11h35
hastiok

Citation:

Envoyé par hastiok

Je vois pas pour qu'elle raison le responsable du développement web du developpez.com s'en fout de ma gueule.
C'est très respectueux de ta part Monsieur !!!

Babino, je suis vraiment tres désolé, j'ai pas fait attention et j'ai pensé que ce code ci dessous correspand aux styles d'insertion dont tu m'a parlé. :oops:

#Bovino{
chambreur: max;
cassant: repeatedly;
mechant: never;
competent: none !important;
}
04/12/2009, 12h08
vermine

<td>
Je ne sais pas pq mais j'ai testé de l'accrocher à (un seul à la fois bien entendu):
Code:

1 2 3 4 5 6 7 8 9 //1 <table id="table_principal"> //2 <tbody id="table_principal"> //3 <tr id="table_principal"> //4 <td id="table_principal">
Et seul le td me fait apparaitre l'image.
04/12/2009, 12h18
kernelfailure

C'est la première fois que je vois Image être utilisé comme un Node.

Je suis surtout surpris que cela fonctionne sous certains navigateurs.
Donc, on peut aussi envisager un appendChild avec Array, Date, Number ? :roll:

Pour être plus clean, remplace ton new Image() par un document.createElement('IMG').

Pas d'insertion possible de tag IMG dans un TBODY. Un TD ou un TH, oui. Sinon, le résultat risque d'être improbable.
04/12/2009, 12h28
E.Bzz

Bonjour,

Citation:

Envoyé par kernelfailure

Pas d'insertion possible de tag IMG dans un TBODY. Un TD ou un TH, oui. Sinon, le résultat risque d'être improbable.

+1

Ce qui n'empêche pas de suivre la recommandation de Babino ;)

A+
04/12/2009, 12h34
vermine

+1 varnime qui dit depuis le début de l'attacher au <td>. :P
Hein, E.baa.

Par contre, je veux bien connaitre les inconvénients d'un new Image(), même si dans ce cas-ci j'aurais de toute manière fait un createElement.
04/12/2009, 12h41
E.Bzz

Citation:

Envoyé par vermine

+1 varnime qui dit depuis le début de l'attacher au <td>. :P
Hein, E.baa.

:lol:
Exact, mais tu as quand même pris la peine de tester les 3 précédents :mrgreen:

Citation:

Envoyé par vermine

Par contre, je veux bien connaitre les inconvénients d'un new Image(), même si dans ce cas-ci j'aurais de toute manière fait un createElement.

Ben contrairement à <IMG> c'est un objet Javascript, pas HTML ...
(comme Array, Integer ... cf. kernelfailure)

A+
04/12/2009, 13h29
Bovino
Attention aux confusions avec new Image() ;)

Le tableau Images est une propriété de l'objet document, donc new Image() crée en fait un élément HTML de type img !
Code:

1 2 alert(new Image()) // => [object HTMLImageElement] alert(new Image().tagName) // => 'IMG', même avec IE6 !!!
;)
04/12/2009, 13h55
E.Bzz

Oups !

Au temps pour moi :oops:
04/12/2009, 16h28
kernelfailure

Idem 8O

Merci pour cette correction :ccool:
05/12/2009, 21h01
hastiok

Bonjour Messieurs,

Pour éviter les problèmes que peut causer l'utilisation d'un tableau avec la méthode appendChild, j'ai utilisé dans la page parente une balise DIV au lieu du tableau que je lui applique appendChild comme suit:
parent.document.getElementById("id_du_div").appendChild(pic);.
Maintenant ca marche avec IE8 (ca qui n'été pas le cas avant), sauf que avec ie6 c'a marche pas :cry:.Notre client exige absolument que c fonctionne avec IE6.
Est ce que ya un moyen ou une autre piste à essayer. Je suis pret à m'investir dans n'importe qu'elle proposition pour que cela fonctionne.
Merci d'avance
13/12/2009, 19h35
hastiok

Probleme résolu

Bonjour à tous,
Finalement j'ai réussi à résoudre mon probleme.
En fait l'ors de la création de l'élément image et en essayant les deux alternatives:
pic = new Image(); et pic = document.createElement('IMG');
J'avais toujours le même souci avec IE6 !!!
Apres qq jours j'ai trouvé le secret du mystérieu message:"Argument inavalide" quand j'utilise la méthode appendChild.
Il a fallu crée l'élément comment suit:
pic = parent.document.createElement('IMG');

Merci à vous tous pour votre aide.