JQuery ile Like, Dislike ama..
Arkadaşlar çok bakındım ama tam aradığıma denk gelemedim. Jquery ile Beğen, beğenme yapmak istiyorum. Bunun örnekleri çok. Ama ben bir kez beğene basıldığında hem ikinci kez basılMAsın istiyorum, veya ikinci kez basıldığında Beğeniyi geri alsın.
Örneklerin çoğu her tıklamaya sayı artırıyor.
Öncelikle beğen-beğenmeme olayını üye olmayanlara yani herkese açık yaparsan saydırman imkansız. IP adresine göre eklesen VPN ile IP değiştirmek çok kolay, cookie tutsan cookiler silinir, session belirlesen browser kapanınca ya da session gc çalışınca sessionlar uçar ve binlerce beğeni eklenebilir.
Bu yüzden sadece üyelerin bu işlemi yaptığından emin olman lazım. Veritabanında votes
diye bir tablon olduğunu varsayalım.
kolon | tur |
---|---|
vote_id | int(11) |
vote_post_id | int(11) |
vote_user_id | int(11) |
vote_type | varchar(255) |
Ve bir post'u beğenip beğenmemeye yapacağını farz edelim. 2 butonun olacak bu aksiyon üzerine.
<button onClick="like(1, this)">Beğen <span>0</span></button>
<button onClick="dislike(1, this)">Beğen <span>0</span></button>
Burada 1
senin post id'n. artık onu php ile dinamik yazdırırsın :)
İlk olarak ilgili fonksiyonları bir oluşturalım javascrip tarafında.
function vote(postId, type, callback){
let data = {
type: type,
postId: postId
};
$.post('api.php', data, callback, 'json');
}
function like(postId, elem){
vote(postId, 'like', function(response){
if (response.error){
alert(response.error)
} else {
let span = $('span', elem)
let likes = parseInt(span.text())
span.text(likes + 1)
}
});
}
function dislike(postId, elem){
vote(postId, 'like', function(response){
if (response.error){
alert(response.error)
} else {
let span = $('span', elem)
let dislikes = parseInt(span.text())
span.text(dislikes - 1)
}
});
}
şimdi de api.php
örneğinin nasıl olacağına bakalım
<?php
$type = $_POST['type'];
$response = [];
// üye girişi yapmamışsa süreci bitir
if (!isset($_SESSION['user_id'])){
die('Request denied.');
}
switch($type){
case 'like':
$post_id = $_POST['postId'];
$user_id = $_SESSION['user_id'];
$data = [
'post_id' => $post_id,
'user_id' => $user_id,
'type' => 'like'
];
// daha önce aynı kullanıcı postu beğenmiş mi kontrol et
$query = $db->prepend('SELECT * FROM votes WHERE vote_post_id = :post_id && vote_user_id = :user_id && vote_type = :type');
$query->execute($data);
$row = $query->fetch(PDO::FETCH_ASSOC);
if ($row){
$response['error'] = 'Zaten bu konuyu beğendin.';
} else {
$query = $db->prepend('INSERT INTO votes SET vote_post_id = :post_id, vote_user_id = :user_id, vote_type = :type');
$insert = $query->execute([
'post_id' => $_POST['postId'],
'user_id' => $_SESSION['user_id'], // sessindan gelmeli
'type' => 'like'
]);
if ($insert) {
$response['success'] = 'İçeriği beğendiniz.';
} else {
$response['error'] = 'Bir sorun oluştu.'
}
}
break;
case 'dislike':
$post_id = $_POST['postId'];
$user_id = $_SESSION['user_id'];
$data = [
'post_id' => $post_id,
'user_id' => $user_id,
'type' => 'dislike'
];
// daha önce aynı kullanıcı postu beğenmiş mi kontrol et
$query = $db->prepend('SELECT * FROM votes WHERE vote_post_id = :post_id && vote_user_id = :user_id && vote_type = :type');
$query->execute($data);
$row = $query->fetch(PDO::FETCH_ASSOC);
if ($row){
$response['error'] = 'Zaten bu konuyu beğendin.';
} else {
$query = $db->prepend('INSERT INTO votes SET vote_post_id = :post_id, vote_user_id = :user_id, vote_type = :type');
$insert = $query->execute([
'post_id' => $_POST['postId'],
'user_id' => $_SESSION['user_id'], // sessindan gelmeli
'type' => 'like'
]);
if ($insert) {
$response['success'] = 'İçeriği beğendiniz.';
} else {
$response['error'] = 'Bir sorun oluştu.'
}
}
break;
}
echo json_encode($response);
ek olarak tabi posts
tablonda likes
ve dislikes
kolonları açıp sayıları orada tutabilirsin, her like ve disliketa ilgili konunun kolonlarını güncelleyebilirsin api.php
de ki ilgili alanlarda. en basit olarak böyle bir yapı kurulabilir, tabi yapıyı kendine göre düzenlemen gerekir.