将like按钮转换为Ajax驱动的like按钮答案

【问题标题】：Converting like button to Ajax powered like button将like按钮转换为Ajax驱动的like按钮
【发布时间】：2020-05-20 15:58:25
【问题描述】：

我正在开发一个反向博客项目，用户可以在其中点赞和评论。虽然我成功实现了点赞按钮，但是它刷新了页面。

我的问题是我试图将其转换为使用 Ajax 来为按钮供电。并且 to 也使用一个标志来决定显示哪个按钮，喜欢或不喜欢。

请我需要帮助或逻辑来指导我将按钮转换为使用 Ajax 请注意：我使用分页和类似按钮位于列表视图和详细信息视图 (CBV) 上。提前谢谢你。

这是我对按钮的看法

这是我的模型

这是我的模板渲染

【问题讨论】：

请使用代码 sn-ps 代替图片。

标签： python jquery django ajax django-class-based-views

【解决方案1】：

如果您有多个赞按钮，请为每个赞按钮设置一个唯一的 ID。将 click 事件绑定到 JS 函数，您将在其中创建 ajax 调用。将模型对象的 ID（以增加喜欢计数）传递给您的 JS 函数，该函数将在您的 ajax 调用中传递给您的视图。指定您的类似增量函数所在的视图的 URL。

下面是django中点击按钮的ajax调用实现

https://stackoverflow.com/a/13733855/11979793

更新：ajax 的基于类的视图更改

在基于类的视图函数中：

接受参数：


        model_id = json.loads(request.POST.get('param_name')) # model_id could be your post ID to increase the likes

不是为 ajax 渲染返回 JSON 响应：

        return JsonResponse({
             'like_count': model_to_dict(total_likes), # if you want to display total likes
             'success': True
             })

您可以在 ajax 的成功功能中使用 total likes 将其显示在您的模板中。

附： import json 在文件开头

更新：处理 ajax POST 请求的示例基于类的视图

class myClassView(View):
    template_name='index.html'
    def post(self,request):  # overriding the post method
        myparam = json.loads(request.POST.get('paramFromAjax'))
        # perform your actions here
        # make a dictionary/context say mydic and pass parameters in that
        return JsonResponse({
             'paramToAjax': mydic,
             'success': True
             })

【讨论】：

谢谢，今晚我会试一试，告诉你最新进展。
请返回 JsonResponse() 我应该在 CBV 中还是在 post_like 函数中使用它。
如果你的 ajax 类型是 POST 那么你的 post 函数应该返回 jsonresponse
我的问题是重组 CBV 以接收或使用 Ajax 调用。
工作，但即使在调用 event.preventDefault() 后页面仍会刷新。