AJAX delete - using jQuery

Question

I have a simple cart page that displays items that are in someones cart, and having it display via an ASP while from my table. I have a column where a user can delete an entry. I have the ASP working properly, now I am trying to add some AJAX in to it. I have the following code:

$("img.delete").click(function() {
var id     = $('#id').attr('value');        
    $.ajax({
        type: "POST",
        url: "delete.php",
        data: "id="+ id,
        success: function(){
            $('tr.selector').remove();
            $('div.success').fadeIn();
        }
    });
return false;
});

The thing is, how wouild I go about setting it up for each value, because if I use the above, I click one and they will all go. I am confused on how to set it up to work with numerous rows.

Answer 1

You need to select only the item's row for removal. I'm not sure how you have it set up, but if the image element is inside the row you could use:

 $("img.delete").click(function() {
      var row = $(this).parents('tr:first');

      ...

      success: function(){
           $(row).remove(); //Remove the row containing the image element
           ...
      }

      ...
  });