Discussion :

[AnTiX]

Bonjour,

Je suis en train de réaliser un formulaire et j'ai un petit probléme. Concrétement, j'ai une action qui peut avoir un nombre illimité de responsable. C'est pour ca que j'aurais aimé générer un <input> en fonction d'une case coché ou autre, pour que l'utilisateur mette le nombre de responsable qui lui convient.

Seulement je débute en javascript et je ne voie pas trop comment je pourrais créer un <input>. Si vous aviez une idée ou une piste, cela m'aiderai bien .

Merci

[denisC]

Code :

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

1
2
3
4
5
 
var nouveauInput = document.createElement("input");
nouveauInput.type=....
nouveauInput.value=....
nouveauInput....

Ensuite reste à placer le nouveauInput au bon endroit dans ton document.
Tu peux nous montrer ton code HTML?

[AnTiX]

Merci beaucoup, je vais tester ca .

Voici mon code html :

Code :

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

1
2
3
4
5
6
7
8
9
10
<form name="observation3" method="post" action="">
	<h3>Causes</h3>
	<textarea id="causes" name="causes"></textarea>
	<h3>Actions</h3>
	<textarea id="actions" name="actions"></textarea><br/>
	</p>
 
	<p>Responsable<br/></p>
	<input type="text" name="Responsable" size="12" maxlength="30"/><br/>
	<input type="bouton" value="Ajouter nouveau responsable" name="ajouter"/>

A priori il faut donc que je place ca entre mon champ texte et mon bouton.

[denisC]

Code :

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

1
2
 
<input type="bouton" value="Ajouter nouveau responsable" name="ajouter" id="ajButton"/>

puis un javaScript du type:

Code :

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

1
2
3
4
5
6
7
8
9
 
var nouveauInput = document.createElement("input"); 
nouveauInput.type='text';
nouveauInput.size=12;
nouveauInput.maxlength=30;
nouveauInput.name='Responsable';
nouveauInput.value='nouveau responsable';
var ajButton = document.getElementById("ajButton");
ajButton.parentNode.insertBefore(nouveauInput,ajButton);

Ca devrait te permettre de créer un input supplémentaire placé avant ton bouton.
Attention de bien mettre en place coté serveur tout ce qui est nécessaire pour qu'il y ait non plus un attribut responsable, mais plusieurs.

Bonne chance

[AnTiX]

Merci beaucoup, clair net et précis que demander de plus ?

[AnTiX]

Un dernier truc qui n'a pas grande importance, c'est pas possible de sauter automatiquement une ligne aprés le nouveau input créé ?

[denisC]

Utilise la même technique, et créé un élément br

Code :

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

1
2
3
4
5
 
var nouveauBr = document.createElement("br");
....
ajButton.parentNode.insertBefore(nouveauInput,ajButton);
ajButton.parentNode.insertBefore(nouveauBr,ajButton);

et ca ajoutera un br juste avant le bouton. Si tu veux l'insérer avant le nouveau input:

Code :

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

1
2
 
ajButton.parentNode.insertBefore(nouveauBr,nouveauInput);

[AnTiX]

Ok ^^

Merci encore =)