Laravel like sistemi ajax ile post ettirmek ile ilgili
Merhabalar,
Sorum biraz uğraşlı olacak o yüzden şimdiden vaktinizi çaldığım için herkesten özür diliyorum. Ve teşekkür ediyorum.
Şuradaki like sistemi kullanıyorum;
https://dev.to/bdelespierre/how-to-implement-a-simple-like-system-with-laravel-lfe
Daha basit bir yapı da yapabilirdim bunu seçtim çünkü çok işlevsel duruyor. Her yere uygulanabiliyor rahatlıkla.
Ancak, yapan arkadaş post işlemini sayfa yenileme türünden yapmış. Ben bunu ajax ile post ettirmeye çalışıyorum ve kısmen de başarılı oldum.
Şöyle bir sorunum var ajax ile post ettirdikten sonra oradaki buton sayfa yenilenene kadar sabit kalıyor... Ben de onu ilkel bir yöntemle javascript yordamıyla aşağıdaki şekilde d-block d-none yaparak gizleyip diğerinin açılmasını sağlamaya çalışıyorum. Bu da gayet çalışıyor gibi görünüyordu taa ki delete methodunun iki kere post ettirilip birinin hata sonucu dönderdiğini görene kadar.
Şimdi biliyorum ki kodum çalışıyor yapması gerekeni yapıyor ama bir yerlerde bir hata yaptığımı ve uzun vadede bana sıkıntı yaratacağını gözlemleyebiliyorum.
$(document).on('click', '.ajax-submit', function(e) {
e.preventDefault();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
destroy_id = $(this).attr('id');
var _token = $('meta[name="csrf-token"]').attr('content');
var id = $(this).parent().find('.id').val();
var likeable_type = $(this).parent().find('.likeable_type').val();
$.ajax({
type: 'POST',
url: '{{route('like')}}',
data: {
id: id,
likeable_type: likeable_type,
_token: _token,
},
dataType: 'json',
success: function (result) {
$(".upvote-" + destroy_id).addClass('voted');
$(".u-" + destroy_id).addClass('d-none').removeClass('d-block');
$(".d-" + destroy_id).addClass('d-block').removeClass('d-none');
console.log(result);
}
}).done(function (response) {
var likes = response.likes;
$('#numberOfLikes-' + destroy_id).html(response.likes);
});
});
$(document).on('click', '.ajax-delete', function(e) {
e.preventDefault();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
destroy_id = $(this).attr('id');
var _tokena = $('meta[name="csrf-token"]').attr('content');
var id = $(this).parent().find('.id').val();
var likeable_type = $(this).parent().find('.likeable_type').val();
$.ajax({
type: 'DELETE',
url: '{{route('unlike')}}',
data: {
id: id,
likeable_type: likeable_type,
_token: _tokena,
},
dataType: 'json',
success: function (result) {
$(".upvote-" + destroy_id).removeClass('voted');
$(".d-" + destroy_id).addClass('d-none').removeClass('d-block');
$(".u-" + destroy_id).addClass('d-block').removeClass('d-none');
console.log(result);
}
}).done(function (response) {
var likes = response.likes;
$('#numberOfLikes-' + destroy_id).html(response.likes);
});
});
Buraya kadar okuyup, sorunumu irdeleyebilen tüm herkese sonsuz teşekkürler <3
Öncelikle ajaxda hem csrf için header verip hem de data olarak _token vermenize gerek yok. Sadece birisi yeterli olacaktur. Onuda 2 fonskyona yazmanıza gerek yok fonskyon dışı bir yerde yazsanız yeterli olacaktır. Ve hatanızı net bir şekilde anlayamadım biraz açıklayabilirmisiniz?
Sorun beğendikten sonra sil dediğini düşünürsek, bir kez daha sile tıklarsa oluşan hata mı?