Удаление строки из динамической таблицы при щелчке по изображению

Question

Я работаю над сеткой PHP/MySQL, которая отображает два маленьких значка, один из которых должен удалить реальный регистр и удалить строку, а другой должен перенаправить пользователя на другая страница открывает информацию о выбранном регистре. Это как мой код выглядит следующим образом:

PHP:

$output .='<tr id="'.$id.'">'; 
$output .='<td align="center">'.$expiration_date.'</td>'; 
$output .='<td>'.$title.'</td>'; 
$output .='<td>'.$title_pt.'</td>'; 
$output .='<td align="center">'.$last_update.'</td>'; 
$output .='<td align="center">'.$active_pack.'</td>'; 
$output .='<td align="center" class="icon_grid"><a id="edit" title="Open the register." href="special_pack_open.php?id='.$id.'"><img src="images/Write2.gif" width="16" height="16" /></a></td>'; 
$output .='<td align="center" class="icon_grid"><a id="delete" title="Delete the register." href="#"><img src="images/Trash.gif" width="16" height="16" /></a></td>'; 
$output .='</tr>'; 

JQuery:

<script type="text/javascript"> 
$(document).ready(function() { 
    $('table tr[id]').click(function(){ 
     $(this).closest("tr").remove(); 
     var obj = $(this); 
     $.ajax({ 
      type: "POST", 
      url: 'delete_package.php', 
      data: { pk_id: obj.attr("id")}, 
      dataType: "json", 
      success: function(data, evt) { 
      if (data.success == "true") { 
       alert('The record has been deleted successfuly!'); 
      } else { 
       alert('error'); 
      } 
      } 
     }) 
    }) 
}) 
</script> 

Все работает очень хорошо. Когда я нажимаю на Trash.gif, он удаляет регистр и удаляет строку. Дело в том, что когда я нажимаю на Write2.Gif (вторая ссылка), где он должен перейти на следующую страницу, он выполняет то же действие, что и удаление! Как я могу изменить свой код JQuery, чтобы понять, что только одна ссылка предназначена для удаления регистра?

спасибо.

Answer 1

$("table tr[id]") является селектор для любого tr, который является потомком table, что имеет какое-либо id атрибут вообще. Вам нужен более конкретный селектор.

Как вы будете иметь много строк, вы, вероятно, следует с помощью класса вместо идентификатор для редактирования/удаления.

$(".delete").on("click", function() { /* your code */ 

Вам также может понадобиться, чтобы делегировать это событие

$("#id-of-table").on("click", ".delete" 

Answer 2

Я не то, что опыт работы с JQuery, но это, кажется, что ваш селектор вызывает функцию удаления ассоциироваться с храповой случае тр. Попробуйте это с помощью $ ('# delete'). Нажмите вместо $ ('table tr [id]').

Answer 3

<script type="text/javascript"> 
$(document).ready(function() { 
    $('table tr[id]').click(function(){ 
     $(this).closest("tr").remove(); 
     var obj = $(this); 
     $.ajax({ 
      type: "POST", 
      url: 'delete_package.php', 
      data: { pk_id: obj.attr("id")}, 
      dataType: "json", 
      success: function(data, evt) { 
      if (data.success == "true") { 
       alert('The record has been deleted successfuly!'); 
      } else { 
       alert('error'); 
      } 
      } 
     }) 
    }) 
}) 
</script> 

заменить это $ ('стол тр [ID]) с этим $ ('а # удалить')