supprimer ligne dans formulaire dynamique [Résolu]

[knebhi]

Bonjour,

J'ai créé un formulaire et une partie de ce formulaire est dynamique. Je peux ajouter des champs en cliquant sur un bouton ajouter.

Le soucis est que je souhaite supprimer l'un de ces champs quand je le souhaite.
j'ai donc créer une fonction javascript permettant de supprimer la dernière ligne ajoutée.

mon problème est que je peu ajouter et supprimer les lignes mais dans le cas ou je supprime et je rajoute un champ le formulaire n'agit pas comme je le voudrai.
ex : j'ajoute un champ "responsable 2"
je le supprime
et j'en rajoute un apres . il m'apparaitra le champ "responsable 3" juste apres le champ "responsable 1"

en fait, le formulaire ne met pas a jour l'indice de la ligne.

voici mon formulaire
form.php

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<tbody id="Responsable_corpus">
				<tr>
 
					<td>- Responsable du corpus 1 :</td>
					<td><input type="text" size="50" name="Responsable_corpus1"
						onKeyUp="javascript:couleur(this);">
 
 
						</td>
 
 
				</tr>
 
			</tbody>
			<tr>
				<td><input type="button" value="Ajouter un responsable"
					onclick="addRespCorpus()" /></td>
			</tr>

mon code javascript d'ajout de ligne

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function addRespCorpus() {
 
	nRC++;
 
	var newRow = document.getElementById('Responsable_corpus').insertRow(-1);
	var newCell = newRow.insertCell(0);
	newCell.innerHTML = '- Responsable du corpus ' + nRC + ' : ';
	newCell = newRow.insertCell(1);
	newCell.innerHTML = '<input  type="text" size="50" name="Responsable_corpus' + nRC + '" onKeyUp="javascript:couleur(this);">';
	newCell = newRow.insertCell(2);
	newCell.innerHTML = ("<input type=button name=supprimer value=Supprimer onclick=suppression()>");
 
 
 
}

ma fonction qui permet de supprimer

Code :

1
2
3
4
5
6
7
8
9
function suppression()
{
 
var nb = document.getElementById('Responsable_corpus').rows.length;
document.getElementById('Responsable_corpus').deleteRow(-1);
 
 
 
}

[Katachana]

En utilisant cela dans ta fonction d'ajout pour récupérer l'indice:

Code :

1
2
 
var nb = document.getElementById('Responsable_corpus').rows.length;

[knebhi]

Envoyé par Katachana

En utilisant cela dans ta fonction d'ajout pour récupérer l'indice:

Code :

j'ai apporté les modification à mon code qui sont :

fonction ajout de ligne

Code :

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
 
var nRC = 1;
function add {
 
	nRC++;
	var tableau = document.getElementById('Responsable_corpus');
 
	var ligne = tableau.insertRow(-1);
 
	// var newRow = ligne;
	var nb = tableau.rows.length;
 
	var newCell = ligne.insertCell(0);
	newCell.innerHTML = ligne.rowIndex;
	newCell.innerHTML = '- Responsable du corpus ' + nRC + ' : ';
	newCell = ligne.insertCell(1);
	newCell.innerHTML = '<input  type="text" size="50" name="Responsable_corpus' + nRC + '" onKeyUp="javascript:couleur(this);">';
	newCell = ligne.insertCell(2);
	// newCell.innerHTML = ("<input type=button name=supprimer value=Supprimer
	// onclick=suppression()>");
 
	var bouton = document.createElement("input");
	bouton.type = "button";
	bouton.value = "Supprimer";
	bouton.onclick = function() {
		suppression(ligne)
	};
	newCell.appendChild(bouton);
 
}

et
la fonction suppression de ligne

Code :

1
2
3
4
5
6
7
8
9
10
 
 
function suppression(ligne) {
 
	var nb = document.getElementById('Responsable_corpus').rows.length;
	 document.getElementById('Responsable_corpus').deleteRow(-1);
 
 
 
}

j'ai toujours le même souci j'ai peut etre omis quelque chose.

merci de votre aide

[vermine]

Bonjour,

Et en décrémentant nRC dans la fonction de suppression ?

Code :

nRC--;

[knebhi]

Envoyé par vermine

Bonjour,

Et en décrémentant nRC dans la fonction de suppression ?

Code :

nRC--;

tu me sauve la lol

merci vraiment sa commencai a me rendre dingue surtout avec cette chaleur