JQuery ближайший выбор TR

Question

Надеюсь, кто-то может посоветовать. Возникли проблемы при попытке удалить строку после нажатия на ссылку.

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>

Теперь JS

 $("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);
    }    
   }
  })
 });

Это должны быть простые, но не удаляющие строки. Просто для удовольствия, если я изменю это на что-то вроде

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

Это добавит foo ко всем строкам таблицы. Так что могу понять, почему не удаляется ближайший ряд.

Есть идеи?

Спасибо заранее.

Answer 1

Проблема this в настоящее время относится к объекту ajax в вашем success обратном вызове, но это легко исправить, используйте параметр content, например:

 $("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);
    }    
   }
  })
 });

Опция context указывает, что будет this в функциях обратного вызова $.ajax(), поскольку вы хотите, чтобы это был .remove-row, по которому вы щелкнули, используйте this в качестве опции .

Answer 2

Ответ Ника должен сработать, но вы тоже можете это сделать, я не знаю, какой из них лучше, вероятно, ответ Ника, но в любом случае это может помочь ...

Answer 3

Не было бы проще сделать удаление / спрятать перед рукой?

как это:

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

Answer 4

У вас есть незамкнутый атрибут class="remove-row в первом ряду.

Смотрите здесь