Discussion :

[dario81]

bonjour à tous.

Je me retrouve dans une petite impasse et je sollicite votre aide.

Je souhaiterais dupliquer les inputs qui se trouvent dans ce div en cliquant sur un bouton de formulaire:

Code HTML :

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

1
2
3
4
5
6
7
<div id="ingredientsDetail">
<div id="creationIng">
<input type="texte">
<input type="texte">
<input type="button" value="&#x2b;" onclick="newItem()">
</div>
</div>

et voici mon code javascript :

Code :

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

1
2
3
4
5
function newItem()
		{
     	var new=document.getElementById("creationIng").cloneNode(true);
		document.getElementById("ingredientsDetail").appendChild(new);
		}

N'étant pas un pro en javascript, je n'arrive pas à débugger ma fonction et comprendre ce qui ne va pas.

Merci d'avance pour votre aide, Gerald

[dario81]

le nom de ma variable n’était pas correct.

Le nom de 'new' posait problème, je l'ai modifiée en 'iNew' et tout fonctionne.

Je mets ce post en "résolu".

Bonne journée, soirée et surtout bonne année a tous.... Gerals

[javatwister]

Ne fais surtout pas ça: tu vas dupliquer creationIng avec le même id et tout son contenu, y compris le bouton...

Une petite recherche sur le forum s'impose car le sujet a été traité à peu près 3 milliards de fois.

[dario81]

Ha!?! ben merci pour ta réponse, si je ne trouve ppas pr moi-même, je chercherais encore.

Encore merci et bonne année :-)

[dario81]

bonsoir.
Je reviens vers vous, suite a la remarque de JAvawitser, j'ai remodifier un peu (enfin, j'ai trouvé une qui fonctionne mieux! ) ma fonction
Le voici:

Code :

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

1
2
3
4
5
6
7
8
9
 
var i;
var item = document.getElementById("creationIng");	
for (i = 1; i < 20; i++) 
{
		var clone = item.cloneNode(true);
		clone.id = 'creationIng'+i;
		document.getElementById("ingredientsDetail").appendChild(clone);
}

Le hic c'est qu'elle me crée les 20 div en une fois alors que je voudrais les créer un par un jusque 20 maximum.

Merci pour votre aide, Gerald...

[javatwister]

Hum. quand tu cliques le bouton, tu veux recréer un div comme creationIng, c'est ça? Qui contienne deux input?

=> Ton bouton est mal placé, il faut que tu en aies conscience;
=> De fait, tu peux cloner creationIng avec (true) et mettre à jour son id;
=> Je ne comprends pas pourquoi tu dis "un par un" alors que la div contient 2 input au départ.