Я не могу понять, почему мой Ajax не работает с Django (как кнопка) - PullRequest
0 голосов
/ 06 сентября 2018

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

Но что-то пошло не так, и мой ajax показывает неверное количество лайков. Например, если бы у меня было 3 лайка, и я бы добавил еще один, это показало бы 4 лайка, но когда я нажимаю снова, это показывает 2 лайка. Что идет не так и как я могу предотвратить это?

Вот все мои файлы: views.py

class PostLikeAPIToggle(APIView):
    authentication_classes = (authentication.SessionAuthentication, )
    permission_classes = (permissions.IsAuthenticated,)

    def get(self, request, slug=None, format=None):
        #slug = self.kwargs.get("slug")
        post = get_object_or_404(Post, slug=slug)
        user = self.request.user
        updated = False
        liked = False
        if user.is_authenticated:
            if user in post.likes.all():
                liked = False
                post.likes.remove(user)
            else:
                liked = True
                post.likes.add(user)
            updated = True
        data = {"updated": updated,"liked": liked}
        return Response(data)

Мой AJAX (или JavaScript)

<script type="text/javascript">
    $(document).ready(function(){

function Updating(btn, newCount, verb){
btn.text(newCount + " " + verb)
}
$(".like-btn").click(function(e){
    e.preventDefault()
    var this_ = $(this)
    var likeUrl = this_.attr("data-href")
    var likeCount = parseInt(this_.attr("data-likes"))
    var addLike = likeCount + 1
    var removeLike = likeCount - 1
    $.ajax({
        url:likeUrl,
        method: "GET",
        data: {},
        success: function(data){
            console.log(data)
            if (data.liked){
                Updating(this_, "", addLike)
            } else {
                Updating(this_, "", removeLike)
            }
        }, error: function(error){
            console.log(error)
            console.log("error")
        }
    })
})
})
</script>

И мой HTML-файл

    <div style="margin: 15px 150px 15px 20px; font-size: 35px; display: block">
        {% if request.user in post.likes.all %}
        <a data-likes="{{ post.likes.count }}" class="like-btn"  href="{% url 'forum:like_post_like' slug=post.slug %}" data-href="{% url 'forum:like_post_like' slug=post.slug %}"><i class="fas fa-heart"></i> {{ post.likes.count }}</a>
        {% else %}
        <a data-likes="{{ post.likes.count }}" class="like-btn" href="{% url 'forum:like_post_like' slug=post.slug %}" data-href="{% url 'forum:like_post_like' slug=post.slug %}"><i class="far fa-heart"></i> {{ post.likes.count }}</a>
        {% endif %}
    </div>
...