Дифференцировать ссылку на каждый вызов ajax

У меня есть проблема, показать извлеченную базу данных публикаций, где у каждой публикации есть кнопка, чтобы добавить ее в избранное.Дифференцировать ссылку на каждый вызов ajax

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

Код ссылки:

<a href="#" class="btn-add" data-id="{!! $aviso->id !!}"> 
    <i class="glyphicon glyphicon-heart-empty"></i> 
</a>

JS код:

JS код Ajax вызова:

$(document).ready(function() { 
    $('.btn-add').on('click', function(e) { 

    var data = $(this).data('id'); 

    $.ajax({ 
    type: 'POST', 
    url: '{!! url("add-fav") !!}', 
    data: { 'id' : data }, 
    dataType: 'JSON', 
    success: function(data){ 
      if(data.message == 'ok') 
      { 
       $('.btn-add').html('<i class="glyphicon glyphicon-heart"></i>') 
      } 
    } 
}) 

    e.preventDefault(); 

}); 
});

Как уже упоминалось выше, значок, чтобы запустить вызов Ajax, но во всех публикациях.

Если вместо $ ('.btn-add') вместо $ (this) вместо этого ответа значок не меняется.

Как я могу достичь результата? Что добавляет фаворита, только значок, который публикует публикация?

Спасибо вам за помощь. Привет из Чили.

источник

2016-02-22 Cristian Meza

Вы обновляете glyphicon для всех элементов с классом "БТН-добавить". Определить $ (this) перед запросом ajax - var that = $ (this); затем замените - $ ('.btn-add'). html ('') с - $ (that) .html (' '). – user2947

Спасибо за объяснение, я исправил код, как вы сказали, и теперь все работает отлично. Привет из Чили. –

Вы должны кэшировать объект JQuery:

$('.btn-add').on('click', function(e) { 

var $btn = $(this);

А функция успеха:

$btn.html('<i class="glyphicon glyphicon-heart"></i>')

источник

2016-02-22 05:18:19

Большое спасибо за помощь другу, было именно то, что было не так с моим кодом. Привет из Чили. –

Дифференцировать ссылку на каждый вызов ajax

ответ

Смежные вопросы