Problème fonction Javascript

Fermé
DaRealZato Messages postés 1 Date d'inscription mardi 5 mai 2009 Statut Membre Dernière intervention 19 mai 2009 - 19 mai 2009 à 11:34
Bonjour à tous, je suis nouveau sur le forum bien que je l'ai consulté un grand nombre de fois.
Je me permet d'exposer mon problème car je suis en stage et que j'aimerais terminer ce que j'ai entrepris dans les délais qui me sont impartis.
Voilà je travail sur un formulaire HTML où l'utilisateur doit, à un moment donné, ajouter des personnages à partir d'une liste. Mon souhait est de n'afficher q'une seule liste au départ puis d'en rajouter une à chaque fois que l'utilisateur aura sélectionner un personnage dans la précédente. Pour cela j'utilise du javascript, à mon avis le souci provient du childNode bien que je n'en soit pas convaincu. Mon code est le suivant :


<td id="col3"> <!-- Troisième colonne : Personnages -->
<!-- ajouter un personnage+texte/dialogue -->
{literal}
<script type="text/javascript"> <!-- Utilisation de Javascript afin de rendre le formulaire plus dynamique -->
function fenetrevolante2() <!-- popup pour ajouter un personnage -->
{
window.open("ajoutpersonnage.php", "fenetrevolante2", "toolbar=no, location=no, directories=no, status=yes,<BR>scrollbars=yes, resizable=no, copyhistory=no, width=300, height=400, left=300, top=50");
}

function fonctionajoutselect(objet)
{
var nbdial = parseInt(objet.name.replace("selectpersonnage", ""));
var nbdialplusun = parseInt(parseInt(nbdial)+1);
var col3 = document.getElementById('col3');
var modeleoriginal = document.getElementById('modele');
var modele = modeleoriginal.cloneNode(true);
var enfantsmodele = modele.childNodes;

for(i=0; i<enfantsmodele.length; i++)
{
if(enfantsmodele[i].id == "selectpersonnage" + nbdial)
{
var nouveauselect = enfantsmodele[i];
}
}
nouveauselect.name = "selectpersonnage"+(nbdialplusun);
nouveauselect.id = "selectpersonnage"+(nbdialplusun);

for(i=0; i<enfantsmodele.length; i++)
{
if(enfantsmodele[i].id == "checkbox" + nbdial)
{
var nouveaucheckbox = enfantsmodele[i];
}
}
nouveaucheckbox.name = "checkbox" + (nbdialplusun);
nouveaucheckbox.id = "checkbox" + (nbdialplusun);

for(i=0; i<enfantsmodele.length; i++)
{
if(enfantsmodele[i].id == "text" + nbdial)
{
var nouveautextarea = enfantsmodele[i];
}
}
nouveautextarea.name = "text" + (nbdialplusun);
nouveautextarea.id = "text" + (nbdialplusun);
nouveautextarea.innerHTML = "";
col3.innerHTML += "<br />" + modele.innerHTML;
}
nbdial = nbdialplusun;

function fonctionajouttextarea(objet)
{
var nbdial = objet.name.replace("checkbox", "");
var etatcheckbox = document.getElementById("checkbox" + nbdial).checked;
var textdialogue = document.getElementById("text"+ nbdial);
if(etatcheckbox == true)
{
textdialogue.style.display = "block";
} else
{
textdialogue.style.display = "none";
}
}
</script>
{/literal}
<a href="#" onClick="fenetrevolante2()">ajouter un personnage</a><br/>
<div id="modele">
<select name="selectpersonnage1" id="selectpersonnage1">
{foreach from=$tableauPersonnages item=lignePersonnages}
<option onClick="fonctionajoutselect(this.parentNode)" value="{$lignePersonnages.id_personnage}">{$lignePersonnages.nom_personnage}</option>
{/foreach}
</select>
<input type="checkbox" onClick="fonctionajouttextarea(this)" name="checkbox1" id="checkbox1">dialogue</input>
<textarea rows='1' cols='40' name='text1' id="text1" style="display:none;"></textarea>
</div>
</td>*



Il m'ajoute ce que je souhaite mais seulement lorsque je sélectionne un élément dans la première liste, de plus l'élément sélectionné ne s'affiche pas(c'est toujours le premier élément de la liste qui s'affiche) et enfin le texte de la checkbox s'efface à l'ajout d'une liste.

Merci d'avance