Django Ajax GET请求

Question

我对jquery和ajax非常陌生，现在我已经建立了一个django论坛应用程序，在主屏幕上，左侧显示forumposts列表，右侧是空白。因为我是AJAX的新手，所以我已经构建了我的django应用程序，每当我点击左侧显示的任何forumpost时，它会将我重定向到显示内容的详细信息页面。那个帖子。但是，我希望通过使用AJAX来改善用户体验，这样每当我点击左侧的任何forumpost时，右侧的空白区域将被更新并显示该特定帖子的内容。

但我不太清楚如何开始，因为我是jquery / ajax的新手。有人能帮助我吗？谢谢！

Answer 1

所以，假设你想在服务器上渲染它（这是最简单的解释），这很简单。

为您的右侧边栏设置id，以便您可以使用jQuery（例如$("#the-id-here");

）进行引用

使用$.get()，您可以向服务器发出ajax请求。您需要发送您点击的元素的数据，以便django知道要返回的结果。对于练习，只需确保您可以创建一个简单的django视图，您可以使用$.get进行查询，并查看是否可以返回响应。对于AJAX，您很可能需要django.http.HttpResponse或django.http.JsonResponse。

一旦设置了端点并且您已经验证可以使用AJAX访问它，您需要返回一些HTML。在项目中创建HTML模板。对于我没有呈现整页的AJAX请求，我喜欢在我的模板目录中创建名为components/或partials/的子文件夹。你没有必要，但它有助于保持组织有序。

对于渲染模板的AJAX方法，我喜欢使用render_to_string。这让我对如何格式化响应有了一些自由。例如，如果我想返回一些包含HTML和一些元数据的JSON，我可以这样做：

return JsonResponse({
  "html": render_to_string("my_template.html", {"data": "abc"}),
  "status": "ok"
})

回到javascript中，在进行AJAX调用后，您将获得成功的回调函数。在回调中，您需要使用$("#your-element").html(/* response here */)

更新容器的html

总结

1. 在HTML中创建一个容器，其中包含一个可以选择jQuery
的ID
2. 创建一个django视图并验证您是否可以对其进行ajax调用
3. 创建将呈现并发回的模板
4. 如果您需要更多控制响应，请使用render_to_string和JsonResponse呈现模板。
5. 在您的AJAX成功回调中，使用响应使用渲染的模板填充容器。