I have to implement like/dislike functionality in my project but when I refresh the page the user can again like that post that is already liked by that user.
To maintain the state of the user I have taken the IpAddress of the user in DB.
I want if the user already likes the post then the user should not be able to like again that particular post.
Here is my controller code.
public function save_likedislike(Request $request) {
$data=new Like_Dislike;
$data->fkTeamId= Request::post('post');
$ipAdd = Request::ip();
$data->varIpAddress = $ipAdd;
if(Request::post('type') == 'like'){
$data->intLike=1;
} else {
$data->intDislike=1;
}
$data->save();
return response()->json([
'bool'=>true
]);
return $records;
}
Here are the HTML fields like buttons and incrementing the count using jquery ajax code.
<small class="float-right">
<span title="Likes" name="Likes" class= "fa fa-thumbs-up" id="saveLikeDislike" data-type="like" data-post="{{ $team->id}}" class="mr-2 btn btn-sm btn-outline-primary d-inline font-weight-bold">
Like
<span class="like-count">
{{ $team->likes() }}
</span>
</span>
<span title="Dislikes" class= "fa fa-thumbs-down" id="saveLikeDislike" data-type="dislike" data-post="{{ $team->id}}" data-toggle="lightbox" class="mr-2 btn btn-sm btn-outline-danger d-inline font-weight-bold">
Dislike
<span class="dislike-count">
{{ $team->dislikes() }}
</span>
</span>
</small>
JQuery Ajax code
<script>
// Save Like Or Dislike
$(document).on('click','#saveLikeDislike',function() {
var _post=$(this).data('post');
var _type=$(this).data('type');
var vm=$(this);
// Run Ajax
$.ajax({
url: site_url + "/save-likedislike",
type:"post",
dataType:'json',
data:{
post:_post,
type:_type,
_token:"{{ csrf_token() }}"
},
beforeSend:function() {
vm.addClass('disabled');
},
success:function(res) {
// if(jQuery.isEmptyObject(res.success.attached)){
// $("#"+_type+"-count").html();
// var _inCount = _prevCount+1;
// $("#"+_type+"-count").html(_inCount);
// }
if(res.bool==true) {
vm.removeClass('disabled').addClass('active');
vm.removeAttr('id');
var _prevCount=$("."+_type+"-count").html();
_prevCount++;
$("."+_type+"-count").html(_prevCount).load();
}
}
});
});
// End
</script>