在Laravel中使用Ajax定位类

时间:2019-04-09 23:11:53

标签: javascript ajax laravel

我正在建立一个大学社交网络,其中将包含一些脚本和容易找到的工作。到现在为止,我一直关注Academind的Maximilian的教程,我需要更改likes函数才能与我的新设计一起使用。我想对ajax实时使用“喜欢”和“不喜欢”,并提交一个,我想更改图标的颜色。

也花费了一整天的时间来尝试针对喜欢和不喜欢的对象实施计数器,但从未真正实现它的实时性。

PostController.php

<div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
         <a class="navbar-brand" href="Home">
             <img src="https://i.imgur.com/hTiYNNe.png" width="53" height="35" class="d-inline-block align-top ml-2" alt="">
             <li>@Html.ActionLink("About", "About", "Home")</li>
             <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
     </ul>
</div>

app.js

......


 public function postLikePost(Request $request)
    {
        $post_id = $request['postId'];
        $is_like = $request['isLike'] === 'true';
        $update = false;
        $post = Post::find($post_id);
        if (!$post) {
            return null;
        }
        $user = Auth::user();
        $like = $user->likes()->where('post_id', $post_id)->first();
        if ($like) {
            $already_like = $like->like;
            $update = true;
            if ($already_like == $is_like) {
                $like->delete();
                return null;
            }
        } else {
            $like = new Like();
        }
        $like->like = $is_like;
        $like->user_id = $user->id;
        $like->post_id = $post->id;
        if ($update) {
            $like->update();
        } else {
            $like->save();
        }
        return null;
    }

Dashboard.blade.php

var postId = 0;
var postBodyElement = null;

.....


$('.like').on('click', function(event) {
    event.preventDefault();
    postId = event.target.parentNode.parentNode.dataset['postid'];
    var isLike = event.target.previousElementSibling == null;
    $.ajax({
        method: 'POST',
        url: urlLike,
        data: {isLike: isLike, postId: postId, _token: token}
    })
        .done(function() {
            event.target.innerText = isLike ? event.target.innerText == 'Like' ? 'You like this post' : 'Like' : event.target.innerText == 'Dislike' ? 'You don\'t like this post' : 'Dislike';
            if (isLike) {
                event.target.nextElementSibling.innerText = 'Dislike';
            } else {
                event.target.previousElementSibling.innerText = 'Like';
            }
        });
});

我希望有人可以指导我或回答我遇到的“简单”问题。

0 个答案:

没有答案