Discussion :

[Bowen]

J'ai une partie de ma page dynamique, et selon un changement de valeur dans un select, change le innerHTML d'un <TR> de ma page.
Le problème est que j'aimerais ensuite pouvoir accéder aux éléments que j'ai écrit dynamiquement, et que le navigateur me répond que mon nouvel élément "n'a pas de propriété". Voyez-vous une solution?

PS: quand je fais un alert du innerHTML de mon <TR> j'ai bien le code généré, et ce code est bon.

[Auteur]

bonjour,


tu peux nous montrer ton code ?

[SpaceFrog]

c'est généralement le souci lorsque l'on ajoute dynamiquement des 'objets' en utilisant innerHTML ...

Rien en vaut un bon vieux

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.createElement()

[Bowen]

bonjour,


tu peux nous montrer ton code ?

En voici une partie, (Je ne peux pas tout mettre car c'est mélangé avec du coldfusion, je mets l'essentiel).

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<tr><td><select name="type_contenu" id="type_contenu" onchange="gererType(this.options[this.selectedIndex].value)"></td></tr>
<tr id="swapRubriqueDossier"><td>&nbsp;</td></tr>
 
<script language="javascript">
  var JSswapDossier = '<td><select name="dossier_id" id="dossier_id"><option value=""></option></select></td>';
  var JSswapRubrique = '<td><select name="rubrique_id" id="rubrique_id"><option value=""></option></select></td>'
 
  function gererType(typeContenu){
    if(typeContenu==17){
      document.getElementById('swapRubriqueDossier').innerHTML = JSswapDossier
    }else{
      document.getElementById('swapRubriqueDossier').innerHTML = JSswapRubrique
    }
  }
</script>

Dans la réalité, les selects contiennent bien sur beaucoup plus d'options. Mais le code çi-dessus fonctionne (sauf si je me suis trompé en l'épurant...).
Par contre, voici celui qui ne fonctionne pas. C'est un controle sur mon onsubmit

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<script language="javascript">
  function chkForm(f){
    var msg='';
    if(f.type_contenu.options[f.type_contenu.selectedIndex].value==17){
      if(f.rubrique_id.options[f.rubrique_id.selectedIndex].value==''){
        msg=msg+'\n - Une rubrique';
      }
    }else{
      if(f.dossier_id.options[f.dossier_id.selectedIndex].value==''){
        msg=msg+'\n - Un dossier auquel la page appartient';
      }
    }
  }
</script>
<form method="post" name="formul" action="page2.cfm" onsubmit="return chkForm(this);">

à la fin il y a bien sur un traitement pour savoir si mon msg est vide. Par contre le code plante sur la ligne où il cherche à évaluer rubrique_id ou dossier_id, qui sont les deux listes crées auparavant par le javascript.

Je suis partant pour essayer la solution de SpaceFrog

c'est généralement le souci lorsque l'on ajoute dynamiquement des 'objets' en utilisant innerHTML ...

Rien en vaut un bon vieux

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.createElement()

Il faut juste que je puisse faire apparaitre et disparaitre mes select dossier_id et rubrique_id dynamiquement, autant de fois que je veux, puis les controler.

Je ne connais pas cette fonction createElement(). Est-il possible d'avoir une brève explication (oui, je vais voir sur google tout de suite), et surtout, à quoi dois-je faire particulièrement attention pour mon exemple?

[SpaceFrog]

regarde dans la FAQ comment créer des objets ou elements de form avec le DOM...

puis comment les affciher ou les masque avec style.visibility ou style.display

[Bowen]

regarde dans la FAQ comment créer des objets ou elements de form avec le DOM...

puis comment les affciher ou les masque avec style.visibility ou style.display

Si je ne peux que les afficher ou les masquer ça me pose un problème, car ma cellule de tableau reste apparente, même une fois vide. Il n'y a pas moyen de les supprimer directement du HTML?

[SpaceFrog]

tu as une version visible en ligne ...

supprimer une cellule du flux html peut poser des problèmes de structure du tableau il faut un même nombre de cellules par ligne ou modifier les colspan des autres cellules ...

parcontre si tu n'as qu'une cellule par ligne ... joue sur le style.display du tr ...

[Bowen]

tu as une version visible en ligne ...

supprimer une cellule du flux html peut poser des problèmes de structure du tableau il faut un même nombre de cellules par ligne ou modifier les colspan des autres cellules ...

parcontre si tu n'as qu'une cellule par ligne ... joue sur le style.display du tr ...

Non, je n'ai pas de version visible en ligne, par contre, je te remercie pour le style.display, c'est ce qu'il me fallait (je m'obstinais avec le visibility:hidden, et ça ne faisait pas bien du tout car la place de la cellule restait vide). Je vais me débrouiller avec ça.

Open your mind Bowen!!

Merci encore.