Bonjour à tou(te)s,

Je suis en train d'essayer de réaliser un système permettant de mettre à jour une page (interface admin).
Je ne suis qu'à la conception d'un html propre via javascript.

Je rencontre un problème et je me casse les dents dessus depuis pas mal de temps sans trouver de solutions.

J'aimerais pouvoir ajouter et supprimer des champs (input) par pression sur boutons.

Tout marche comme je le souhaite mais sachant que j'attribue un nombre à chaque champs, lorsque j'en supprime un autre que le dernier, les nombres ne se suivent plus... (nombre utilisé pour les attributs : for, id, name ainsi que pour le label du champ)

Comment pourrais-je faire pour que tout les nombres des champs après celui supprimé se décrementent de 1 ?

Voici mon code :

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
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
<script type="text/javascript">
 	var nbr_carac=1;
 	//var caract_tab = new Array();
 
	function fAddCarac() {
 
		if(nbr_carac<20){
			nbr_carac+=1;
 
			var contenu = document.getElementById('cible').innerHTML;
 
			var contenu_Add = '<li><label for="carac_'+nbr_carac+'">Caractéristique '+nbr_carac+' </label><input type="text" id="carac_'+nbr_carac+'" name="carac_'+nbr_carac+'"/><input type="button" value="Suppression" onclick="del_Carac(this)" /></li>';
 
			//caract_tab.push(contenu_Add);
 
			contenu = contenu+contenu_Add;
 
		        document.getElementById('cible').innerHTML = contenu;
		}
		if(nbr_carac==20){
		        document.getElementById('add_carac').style.display="none";
		}
	}
 
 
 
	function del_Carac(id){
		nbr_carac-=1;
		var parent=id.parentNode;
		parent.parentNode.removeChild(parent);
	}
</script>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
 
<ul>				
	<li>Les caractéristiques
	<ul id="cible">
		<li><label for="carac_1">Caractéristique 1</label>
					<input type="text" id="carac_1" name="carac_1"/></li>
	</ul>
	<input id="add_carac" type="button" value="Ajout caractéristique" onclick="fAddCarac()" />
	</li>				
</ul>
Merci pour votre aide.