Почему не все кнопки вызывают функцию если их несколько?

Question

[Альберт]

Привет.

Я удаляю записи с помощью ajax
На странице несколько записей и у каждой есть кнопка Удалить
При нажатии вызывается скрипт ajax затем отправляем запрос в php и удаляем
С этим все ок, удаляет

Но, у меня не нажимаются кнопки если она не 1-я, если 2 и больше то не нажимаются. Это связано с тем что у меня один id указан или как?

Вот код:

<a class='dropdown-item red' id='reviews-delete' data="".$row->id."">Удалить</a>

$(document).ready(function(){
$('#reviews-delete').on('click', function (){
   var del_id = $(this).attr('data');
   $.ajax({
      type:'POST',
      url:'delete.php',
      data:'delete_id='+del_id,
      success: function(data) { 

      setTimeout(function(){
      window.location.reload(false); 
      }, 1000);
         }
   });
 });
});

Answer 1

[Анатолий Иванов]

Я бы повесил обработчик на кнопку <a onclick='doSomething'>Удалить</a>
или на класс

$(document).ready(function(){
$('.reviews-delete').on('click', function (){
var del_id = $(this).attr('data');
$.ajax({
type:'POST',
url:'delete.php',
data:'delete_id='+del_id,
success: function(data) {

setTimeout(function(){
window.location.reload(false);
}, 1000);
}
});
});
});

Comments

[Альберт]

Спасибо!

Answer 2

[xirurgx3d]

вы наблюдаете при клике именно за

reviews-delete

используйте делегирование, что бы следить по какой кнопке нажали
поднимите 'reviews-delete' выше над кнопками и отлавливайте через
event.target

Answer 3

[Сергей delphinpro]

Это связано с тем что у меня один id указан или как?

Именно так.
Используйте класс

<a class='dropdown-item red reviews-delete' data="".$row->id."">
  Удалить
</a>

$('.reviews-delete').on('click', function (){
 // ...
});