2010-08-12 6 views
0

J'ai des images dans des tableaux séparés avec le bouton Supprimer et je voudrais supprimer la table dont le bouton de suppression a été cliqué.jQuery: supprimer la table parent entière

J'ai essayé $(this).closest("table").remove() et $(this).parents("table").remove() mais sans succès. Rien ne se passe.

Voici le HTML:

<table class='".($i % 2 ? "tbl_img_light" : "tbl_img_grey")."> 
<tr> 
<th rowspan='2'>Image here</th> 
<td>Description here 
</tr> 
<tr> 
<td><button class='ad_del_img' value='$filename'>Delete</button></td> 
</tr> 
</table> 

Il pourrait sembler malpropre, il a sorti de mes boucles PHP

and JS: 
$(".ad_del_img").click(function() { 
var file = $(this).val(); 
dataString = "file="+file; 

//$(this).closest("table").remove(); 

$.ajax({ 
     type: "POST", 
     url: 'controlUI/bin/delete_image.php', 
     dataType : 'json', 
     data: dataString, 
     success: function(data) 
     { 
      alert("Success"); 
      $(this).closest("table").remove(); 
     }, 
     error: function(XMLHttpRequest, textStatus, errorThrown) 
     { 
      alert("Error"); 
     } 
     }); 
return false; 
}); 
+2

vous n'avez posté aucun de vos JS. il y a certainement quelque chose de mal avec votre js, parce que cela fonctionne: http://jsbin.com/odole3/edit –

+0

Quel navigateur? Si FF, vérifiez la console d'erreur pour les messages. – Emyr

+0

a découvert le problème il ya juste une seconde, et oui, il était avec mon js: P apparemment $ (cela) ne fonctionne pas si bien dans l'appel ajax, mais j'ai fait un travail autour. Merci quand même. – Seerumi

Répondre

2

Le problème est le contexte ne soit pas maintenue non par défaut, mais dans jQuery 1.4+ vous pouvez spécifier un context, comme ceci:

$.ajax({ 
    context: this, //add this 
    type: "POST", 
    url: 'controlUI/bin/delete_image.php', 
    dataType : 'json', 
    data: dataString, 
    success: function(data) { 
    alert("Success"); 
    $(this).closest("table").remove(); 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
    alert("Error"); 
    } 
}); 

le context option détermine ce qui est this lorsque tous vos gestionnaires d'événements pour la course de demande $.ajax(), y compris success.

+0

+1, je ne savais pas sur la propriété de contexte :) –

+0

nouvelles à moi aussi, merci :) – Seerumi

0
$('button.ad_del_img').click(function() 
{ 
    $(this).closest('table').remove(); 
}); 

Pour moi, l'extrait de code ci-dessus fonctionne perfectlly. Si cela ne fonctionne toujours pas, l'erreur est probablement ailleurs.

Oh, et dans cette méthode, l'en-tête de la table ne soit supprimé .......

+0

édité mon JS dans la question. est-ce que quelqu'un sait pourquoi $ (ceci) ne va pas bien dans l'ajax thingy? $ (this) .remove() enlève encore le bouton, mais il ne trouve pas la table – Seerumi