jQuery nächste TR-Auswahl

Question

Hoffe jemand kann beraten. Probleme beim Versuch, eine Zeile zu entfernen, nachdem auf einen Link geklickt wurde.

HTML

<table> 
    <tr><td>Some Data</td><td><a href="#" class="remove-row>Remove Row</a></td></tr> 
    <tr><td>Some Data</td><td><a href="#" class="remove-row">Remove Row</a></td></tr> 
</table> 

die JS Jetzt

$("a.remove-row").live('click', function(eve){ 
    eve.preventDefault(); 
    $.ajax({ 
    type: 'GET', 
    url: '/someaction/', 
    dataType: 'json', 
    success: function(msg){ 
    if(msg.error){ 
    alert(msg.error); 
    }else{ 
    $(this).closest('tr').remove(); 
    alert(msg.success); 
    }  
    } 
    }) 
}); 

Dies sollte wirklich einfach sein buts seine die Zeile nicht entfernen. Nur für Tritte, wenn ich es in etwas wie

$('.remove-row').addClass('foo'); 

ändern Es wird foo zu allen Tabellenzeilen hinzufügen. So kann verstehen, warum es nicht die nächste Zeile entfernt.

Irgendwelche Ideen?

Vielen Dank im Voraus.

Answer 1

Das Problem ist this bezieht sich derzeit auf die Ajax-Objekt in Ihrem success Rückruf, aber es ist eine einfache Lösung, verwenden Sie die content Option wie folgt aus:

$("a.remove-row").live('click', function(eve){ 
    eve.preventDefault(); 
    $.ajax({ 
    context: this,     //add this here! 
    type: 'GET', 
    url: '/someaction/', 
    dataType: 'json', 
    success: function(msg){ 
    if(msg.error){ 
    alert(msg.error); 
    }else{ 
    $(this).closest('tr').remove(); 
    alert(msg.success); 
    }  
    } 
    }) 
}); 

Die context Option diktiert, was this in der $.ajax() sein Callback-Funktionen, da Sie möchten, dass es die .remove-row, die Sie geklickt haben, verwenden Sie this als die Option.

Answer 2

Sie haben das Attribut class="remove-row in der ersten Zeile nicht geschlossen.

See here

Answer 3

Nick Antwort sollte funktionieren, aber Sie können dies auch tun, ich weiß nicht, was man besser ist, wahrscheinlich ein Nick, aber es kann trotzdem helfen ...

$("a.remove-row").live('click', function(eve){ 
    var row = this; 
    eve.preventDefault(); 
    $.ajax({ 
    type: 'GET', 
    url: '/someaction/', 
    dataType: 'json', 
    success: function(msg){ 
    if(msg.error){ 
    alert(msg.error); 
    }else{ 
    $(row).closest('tr').remove(); 
    alert(msg.success); 
    }  
    } 
    }) 
}); 

Answer 4

Wäre es nicht einfacher, das Entfernen/Verbergen vor der Hand zu machen?

wie folgt aus:

$("a.remove-row").live('click', function(eve){ 
     $(this).hide(); 
     <The rest of your code logic> 
     ......