Logo GNT
Actualités Tests & Guides Bons Plans
GTA 6 iPhone 17 Copilot Switch 2 Temu ChatGPT Tesla
OVH Cloud OVH Cloud
Entraide Développement Développement Langage JavaScript événements dynamiques IE FF ?

événements dynamiques IE FF ?

6 réponses
Avatar
Démosthene
Bonjour à tous,

Je cale devant un problème lié à la manipulation du DOM.


...

</thead>
<form method="post" action="#" name="case_liste" id="case_liste">
<tbody id="contenaire">

</tbody>
</form>

Je souhaite peupler dynamiquement ce tableau.
Pour celà j'utilise :

for (i=0;i<tableau_contact.length;i++) {

var ligne = document.createElement("tr");

var col1 = document.createElement("td");
col1.setAttribute("align", "center");

var text1 = document.createElement("input");
input1 = text1.setAttribute("type", "text");
input1 = text1.setAttribute("value", tableau_contact[i][1]);
* input1 = text1.setAttribute("onClick", "alert('Click')");
* input1 = text1.setAttribute("onBlur", "alert('Blur')");

col1.appendChild(text1);

ligne.appendChild(col1);

document.getElementById('contenaire').appendChild(ligne);
}

Les deux lignes marquées d'un astérisque ont changé plusieures fois sans
succès.

Sous FF, les événements sont déclenchés, mais de manière anarchique
(blur avant click ???)

Sous IE, les événements (j'ai également modifié l'innerHTML d'un div
pour voir) ne se déclenchent pas.

Y-a t-il une "jurisprudence" sur le sujet ?

Avez-vous une piste, un lien pour me venir en aide.

Je vous remercie de préter attention à ce message


Cordialement Démosthène.
Signaler un problème avec ce contenu

6 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
O.L.
input1 = text1.setAttribute("onClick", "alert('Click')");


J'aurais bien mis :
text1.setAttribute("onClick", function(){alert('Click');} );

Avatar
Etienne SOBOLE
ouai ou
text1.onclick = fct;

avec fct définie un peu plus loin...
Etienne
Avatar
YD

Je cale devant un problème lié à la manipulation du DOM.
* input1 = text1.setAttribute("onClick", "alert('Click')");
* input1 = text1.setAttribute("onBlur", "alert('Blur')");
Sous IE, les événements (j'ai également modifié l'innerHTML d'un div
pour voir) ne se déclenchent pas.
Avez-vous une piste, un lien pour me venir en aide.


IE gère très mal l'ajout d'attributs par les méthodes générales du DOM. Il
vaut mieux passer par les propriétés HTML (DOM 0) pour lui :

text1.onclick=function(){alert('Click')};
text1.onblur=function(){alert('Blur')};

Cette syntaxe est également reconnue par Fx.

Si l'évènement ne se déclenche toujours pas, il faut déplacer ces lignes
*après* l'insertion de l'élément dans l'arbre HTML (après tous les
appendChild).

HTH

--
Y.D.

Avatar
Démosthene
Démosthene wrote:
Bonjour à tous,

Je cale devant un problème lié à la manipulation du DOM.


...

</thead>
<form method="post" action="#" name="case_liste" id="case_liste">
<tbody id="contenaire">

</tbody>
</form>

Je souhaite peupler dynamiquement ce tableau.
Pour celà j'utilise :

for (i=0;i<tableau_contact.length;i++) {

var ligne = document.createElement("tr");

var col1 = document.createElement("td");
col1.setAttribute("align", "center");

var text1 = document.createElement("input");
input1 = text1.setAttribute("type", "text");
input1 = text1.setAttribute("value", tableau_contact[i][1]);
* input1 = text1.setAttribute("onClick", "alert('Click')");
* input1 = text1.setAttribute("onBlur", "alert('Blur')");

col1.appendChild(text1);

ligne.appendChild(col1);

document.getElementById('contenaire').appendChild(ligne);
}



Ce n'est pas du DOM, j'ai trifouillé une solution à base d'innerHTML
depuis tout à l'heure.

Celà fonctionne dans IE et FF.

J'essaie tout de suite vos pistes

Cordialement

Démosthène

Avatar
ASM
Démosthene wrote:
Bonjour à tous,

Je cale devant un problème lié à la manipulation du DOM.


</thead>


Attention !
on m'a appris qu'un form ne pouvait *pas* être à l'intérieur d'un table
(çà a peut-être changé depuis mon jeune temps ?)

<form method="post" action="#" name="case_liste" id="case_liste">
<tbody id="contenaire">

</tbody>
</form>

Je souhaite peupler dynamiquement ce tableau.
Pour celà j'utilise :

for (i=0;i<tableau_contact.length;i++) {

var ligne = document.createElement("tr");

var col1 = document.createElement("td");
col1.setAttribute("align", "center");

var text1 = document.createElement("input");
input1 = text1.setAttribute("type", "text");


Je sais que mon IE Mac fait avorter les fonctions
créatrices d'input type text ...

à savoir ?
peut-être avec cette méthode qu'il ignore + ou -
ça va peut-être passer ?

à noter : un input sans type est interprété
comme étant de type text par tous les navigateurs (que je connais)

input1 = text1.setAttribute("value", tableau_contact[i][1]);
* input1 = text1.setAttribute("onClick", "alert('Click')");
* input1 = text1.setAttribute("onBlur", "alert('Blur')");


à quoi sert le input1 ?

text1.onclick = 'alert('Click')';
text1.onblur = 'alert('Blur')';

devrait pouvoir faire ... (sous réserve)

et pendant qu'on y est :

text1.value = tableau_contact[i][1];

col1.appendChild(text1);

ligne.appendChild(col1);

document.getElementById('contenaire').appendChild(ligne);
}

Y-a t-il une "jurisprudence" sur le sujet ?


La jurisprudence est :
quand çà ne marche pas avec le DOM
(pour une raison x, y, ou M$)
passer en vitesse inférieure et revenir au JS de base :-)


--
Stephane Moriaux et son [moins] vieux Mac

Avatar
ASM
Démosthene wrote:
Démosthene wrote:

Ce n'est pas du DOM, j'ai trifouillé une solution à base d'innerHTML
depuis tout à l'heure.


Ah ! ben ! en trichant ... on finit par y arriver :-)

Ceci-dit : se méfier de innerHTML
surtout si on s'en sert pour récupérer/copier du code HTML
déjà écrit


--
Stephane Moriaux et son [moins] vieux Mac