Django ajax 我将如何更改我的代码以使用 ajax 来喜欢帖子而不刷新答案

【问题标题】：Django ajax How would I change my code to use ajax to like posts without refreshingDjango ajax 我将如何更改我的代码以使用 ajax 来喜欢帖子而不刷新
【发布时间】：2021-03-14 19:23:16
【问题描述】：

我正在尝试创建一个赞按钮。目前我有它，以便用户可以喜欢/不喜欢文章上的帖子。但是，每当他们按下按钮时，页面就会重置并将它们带回顶部。我想使用 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（相关网址）

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？我试过寻找教程，但不知道如何适应我的应用程序。任何帮助，将不胜感激。谢谢。

【问题讨论】：

标签： javascript python jquery django ajax

【解决方案1】：

查看教程：How to Use AJAX with Django。它将引导您完成使用 Jquery 和 Vanilla JavaScript 向 Django 发出 AJAX 请求的过程。

这是你需要做的：

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")

当您呈现文章模板时，请在“赞”按钮上设置data-id={{ article_id }}。当您将文章作为 POST 请求正文的一部分发送时，您可以使用 JavaScript 检索文章的 ID。这将允许您获取正确的文章并更新点赞数。

在发出AJAX Post请求时，需要设置CSRF token header；否则，Django 将引发错误。上面的教程涵盖了这一点。

您也将提交 POST 请求的端点是：

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

可以将like的URL作为数据属性输出，如上面的id，用JS抓取。

【讨论】：