Блог

Я пытаюсь создать кнопку «Мне нравится». В настоящее время у меня есть это, чтобы пользователю могло понравиться / не понравиться сообщение в статье. Однако всякий раз, когда они нажимают кнопку, страница сбрасывается и возвращает их к началу. Я хочу использовать Ajax, чтобы исправить это. Это мои файлы для проекта.

index.py

 <form action="{% url 'like-article-view' %}" method="POST" class="mb-1">
{% csrf_token %}
<input type="hidden" name="article_id" value={{article.id}}>
<button type="submit" class="ui primary button" name="{{article.id}}" id="like-unlike-btn">

{% if user not in article.liked.all%}
Like
{% else %}
Unlike
{% endif %}
</button>
 

view.py

 def like_unlike_post(request):
    user = request.user.id

    if request.method == 'POST':
        article_id = request.POST.get('article_id')
        article_obj = Article.objects.get(id=article_id)
        user_ = CustomUser.objects.get(id = user)

        if user_ in article_obj.liked.all():
            article_obj.liked.remove(user_)
        else:
            article_obj.liked.add(user_)

        like, created = Like.objects.get_or_create(user=user_, article_id=article_id )
        if not created:
            if like.value=='Like':
                like.value='Unlike'
            else:
                like.value='Like'
        else:
             like.value='Like'       
        article_obj.save()
        like.save()

    return redirect('index')
 

urls.py (соответствующие URL-адреса)

 path('', views.indexView, name="index")
path('liked/', views.like_unlike_post, name='like-article-view'),
 

models.py (соответствующие модели)

 class Article(models.Model):
    title = models.CharField(max_length=100)
    description = models.TextField()
    category = models.ForeignKey(Category, on_delete = models.CASCADE)
    liked = models.ManyToManyField(settings.AUTH_USER_MODEL, blank=True, related_name='likes')

LIKE_CHOICES = (
    ('Like', 'Like'),
    ('Unlike', 'Unlike'),
)

class Like(models.Model): 
    user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    article = models.ForeignKey(Article, on_delete=models.CASCADE)
    value = models.CharField(choices=LIKE_CHOICES, max_length=8)
    updated = models.DateTimeField(auto_now=True)
    created = models.DateTimeField(auto_now_add=True)
 

Как бы я реализовал Ajax в этом? Я пытался искать учебные пособия, но не уверен, как адаптировать их к моему приложению. Любая помощь будет оценена.
Спасибо.

Ознакомьтесь с руководством: Как использовать AJAX с Django. Он проведет вас через процесс отправки AJAX-запросов в Django с использованием Jquery и ванильного JavaScript.

Вот что вам нужно сделать:

 class LikeArticleView(LoginRequiredMixin, View):
    def post(self, request, *args, **kwargs):
        article = Article.objects.get(pk=request.POST.get("id"))
        qs = article.liked.all()

        if request.user in qs:
            return HttpResponse("Already liked the article.")
        else:
            article.loved.add(request.user)
            return HttpResponse("You liked the Article")
 

При рендеринге шаблона статьи установите a data-id={{ article_id }} на кнопку «Мне нравится». Вы можете получить идентификатор статьи с помощью JavaScript, когда отправляете его как часть тела запроса POST. Это позволит вам выбрать нужную статью и обновить количество лайков.

Когда вы делаете запрос AJAX Post, вам необходимо установить заголовок токена CSRF; в противном случае Django выдаст сообщение об ошибке. В приведенном выше руководстве это описано.

Конечная точка, которую вы также отправили бы POST-запрос, будет:

 path('liked/', views.like_unlike_post, name='like-article-view'),
 

Вы можете вывести URL-адрес like в качестве атрибута данных, например, id выше, и захватить его с помощью JS.