Discussion :

[lemirandais]

Bonjour à tous.
Voila, je dispose d'un formulaire présent dans un tableau afin de facilité la mise en forme.
Je dispose d'un champ input text qui permet de rentrer un tag (un mot pour simplifier). Je voudrais ajouter un lien qui m'ajouterais un autre champ input text qui permettrait de pouvoir ajouter un autre mot ou tag.
Voici un extrait de mon formulaire:

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
17
 
...
<tr><td>Sélectionnez les tags</td><td><?php
//listing des tags disponible
$sql=mysql_query("select * from tag where validation='OUI' order by libelle");
?>
<select name="tag[]" multiple="true"><?php
while($sql1=mysql_fetch_assoc($sql))
{
        echo '<option value="'.$sql1['id_tag'].'">'.$sql1['libelle']."</option>";
}
?>
</select></td>
</tr>
<tr><td>Ajouter un nouveau tag</td><td><input type="text" name="new_tag" /></td></tr>
<tr>
...

En schéma, à l'affichage, je veux qu'il y est un seul champs disponible mais que par le biais d'un lien, d'ajouter une "copie" d'un premier champs afin d'ajouter un tag.
J'ai deja vu ceci sur internet mais je ne sais plus ou je l'avais trouvé, donc si quelqu'un pourrais m'aider. Merci d'avance.

[lemirandais]

J'ai trouvé une solution en partie. voici mon code:

Code :

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

1
2
3
4
5
6
7
8
9
$(document).ready(function()
{
		$("a#add_tag").click(function(event) {
	  	event.preventDefault(); // empêche le traitement par défaut de l'évenement
		});
		$("a#add_tag").click(function() {
		document.getElementById("tag").innerHTML += "<input type=\"text\" name=\"new_tag[]\" /><br />";
		});
});

Le problème est que si je rajoute un tag et que je clique une nouvelle fois pour ajouter un autre tag, le contenu du premier tag disparait et ainsi de suite.
Comme faire pour éviter que le contenu de ce champs disparait.
Merci d'avance.

[cadoudal56]

Hello,

Le mieux étant de compter le nombre d'éléments que tu as dans le formulaire et de numéroter chacun d'entre eux.

Ce que je te conseille, ce serais de leur attribuer une classe propre. Par exemple tu peux ecrire en dur dans le code :

Code :

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

1
2
 
<tr><td>Ajouter un nouveau tag</td><td><input class="mytag" type="text" name="new_tag_1" /></td></tr>

Ensuite coté Ajax tu peux faire ceci :

Code :

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

1
2
3
4
5
6
 
// Compte le nombre d'élément ayant une class mytag dans la page
var num = $("mytag").length;
$("a#add_tag").click(function() {
	document.getElementById("tag").innerHTML += "<input class='mytag' type=\"text\" name=\"new_tag_"+num+"\" /><br />";
		});

Ainsi les noms de tes tags devrait s'incrémenter...

@+
cadou