Supprimer une ligne d'une table

bonjour,
je vous explique la situation. je possède une page jsp qui récupère des données depuis la base de donnée et les affichent dans un tableau. devant chaque ligne j'ai un bouton qui se crée d'une façon dynamique qui a pour role de supprimer cette ligne de la table.

voici mon code jsp qui permet la récupération des données dans ma page jsp

Code:

---

1 2 3 4 5 6 7

<tr id="tr<%= i %>"> <th><%= num_tel %></th> <th><%= messagedefile %> </th> <th> <pre><input type="button" onclick="valider(this);" value="Valider"> <input type="button" bgcolor="#FF5000" onclick="removeRow(this);" value="Supprimer"> </th> </tr>

---

et voici mon code javascript

Code:

---

1 2 3 4 5 6

function removeRow(src) { var Row = src.parentElement.parentElement; document.all("table1").deleteRow(Row.rowIndex); Valider.disabled = true; }

---

le probleme ici c'est que qu'on je click sur le bouton supprimer c'est toujours la 1ere ligne (row) qui s'efface mais pas la ligne désirée.

aidez moi svp à corriger mon code
merci

Code:

---

1 2 3 4 5 6

function removeRow(src) { var Row = src.parentElement.parentElement; Row.parentElement.removeChild(Row); Valider.disabled = true; }

---

Bonjour,
il me semble qu'il manque un niveau de parent
INPUT -> PRE -> TH -> TR
ce qui donne

Code:

---

var oRow = src.parentElement.parentElement.parentElement;

---

maintenant tu peux également utiliser un deleteRow, mais en laissant tombé cet horrible document.all.

Code:

---

oRow.parentElement.deleteRow(oRow.rowIndex);

---

bonsoir,

Code:

---

document.all("table1").deleteRow(Row.rowIndex);

---

document.all n'est reconnu que dans internet explorer. Par conséquent, ça ne marchera pas dans les autres navigateurs.

Utilise GetElementById("table1") pour recupérer l' élément dont l'ID est "table1"

Citation:

---

Envoyé par rollbich

Utilise GetElementById("table1") pour recupérer l' élément dont l'ID est "table1"

---

attention quand même javascript est sensible à la casse ;).

Citation:

---

Envoyé par rollbich

document.all n'est reconnu que dans internet explorer.

---

Mouais... plus Chrome plus Opera plus Safari quand même... :aie:

Mais cela ne veut pas dire que ta remarque est fausse bien au contraire, document.all ne devrait jamais être utilisé !
Parmi les méthodes recommandées, il y a bien sûr getElementById() mais aussi querySelector(), querySelectorAll(), getElementsByTagName(), getElementsByName(), getElementsByClassName()...

merci les gars ça marche à merveille.
maintenant une fois que je clique sur le bouton supprimer une requète s'execute qui me permet de mettre à jour ma base de donnée.
je connais la requete qui me permet d'executer le traitement mais comment modifier ma fonction supprimer pour que je puisse faire la mise à jour?
voici ma fonction javascript

Code:

---

1 2 3 4 5 6 7

<tr id="tr<%= i %>"> <th id="th1"><%= id %></th> <th><%= num_tel %></th> <th><%= messagedefile %> </th> <th> <pre><input type="button" name="valider" value="Valider" style="background-color:#22780F;font-weight:bold;color:#ffffff; onclick="valider(this);"> <input type="button" name="delete" value="Delete" style="background-color:#ff0000;font-weight:bold;color:#ffffff;" onclick="removeRow(this);"> </th>

---

Code:

---

1 2 3 4 5 6 7 8

function removeRow(src) { var oRow = src.parentElement.parentElement.parentElement; oRow.parentElement.deleteRow(oRow.rowIndex-1); var id = document.getElementById('th1') var jspcall = "edit.jsp?id="+id; window.location.href = jspcall; }

---

la page edit.jsp permet de mettre à jour ma base mais j'ai deux questions:
1/comment trouver le bon paramettre id ( il faut que id correspond à id de la ligne supprimée)
2/ j'aimerais que la page edit.jsp soit executée en backgroud.c'est à dire que je reste toujours dans la page initial(qui affiche mon tableau initial)

NB: oRow.rowIndex est different de ID

8O8O8O8O8O8O8O8O8O8O8O8O8O8O8O8O8O

Code:

---

1 2 3

var id = document.getElementById('tr1'); //<================== var jspcall = "edit.jsp?id="+id; // <======================= window.location.href = jspcall;

---

heu id est initialisé avec un DOMElement puis utilisé comme String 8O8O8O8O8O8O8O
Là je comprends pas
soit tu veux l'id du DOMElement et c'est 'tr1' vu que tu fait un getElementByID
et tout ça ne sert à rien
soit tu veux passer dans l'url un DOMElement
et ça n'a absolument aucun sens


je suppose que tu veux faire

Code:

---

1 2	id = oRow.id; oRow.parentElement.deleteRow(oRow.rowIndex-1)

---

pour ensuite faire un appel ajax "edit.jsp?id="+id;
A+JYT

Merci mais si je fais comme ça, id retourne tr0. Or moi je veux le contenu de th0 qui est un child de tr0.

J'ai fais :

Code:

---

id = oRow.getElementById("th1")

---

Mais je n'obtiens aucun résultat.

Tu n'obtiens rien parce que getElementById() ne s'applique qu'à l'objet document...

Ensuite, ton code est mal pensé pour ce que tu veux faire.
Si tu veux récupérer une valeur précise, place-là dans un attribut data-* que tu peux ensuite facilement récupérer avec l'objet dataset ou la méthode getAttribute().

Citation:

---

Envoyé par stoner2008

Merci mais si je fais comme ça, id retourne tr0. Or moi je veux le contenu de th0 qui est un child de tr0.

---

mais utilise les éléments du DOM tu sais bien dans quel élément tu à mis les info non ?

Code:

---

1 2	id = oRow.firstChild().innerText; oRow.parentElement.deleteRow(oRow.rowIndex-1)

---