用 jQuery 显示新的 Django 对象答案

【问题标题】：display new Django object with jQuery用 jQuery 显示新的 Django 对象
【发布时间】：2011-08-03 16:05:31
【问题描述】：

我一直在学习 Django + jQuery，到目前为止，我已经能够 AJAX-ify 一个 New Post 功能。我现在的问题是如何在帖子列表 AJAX-ly 中轻松轻松地显示新帖子？

views.py：

def add_post(request):
error_msg = u"No POST data sent."
post = Post()
if request.method == "POST":
    #do stuff

return HttpResponse("success")

到目前为止，我能够返回“成功”并很好地保存新帖子。

jQuery:

       $("form#add_post").submit(function() {
       //do stuff
       var args = {type:"POST", url:"add_post/", data:data, complete:function(res, status) {
            if (status == "success") {
                alert("success");
            } else {

            }
        }};

       $.ajax(args);

       return false;

   })

只是在这里提醒“成功”，这很好用。如果我刷新页面，我可以在帖子列表中看到新帖子。现在如何加载新的 Post AJAX-ly？我是否必须手动获取 Post 的属性并将它们添加到我的 DIV 中？有没有简单的方法来重新加载我的帖子列表？

谢谢！

【问题讨论】：

标签： jquery python ajax django reload

【解决方案1】：

在您的 Django 后端服务中，您需要返回一些与应用程序逻辑相关的信息。大多数情况下，人们倾向于为此使用 JSON。

def add_post(request):
   error_msg = u"No POST data sent."
   post = Post()
   if request.method == "POST":
      #do stuff
      response = HttpResponse(content_type = 'application/javascript')
      data = dict()
      #here it comes your logic
      #that fills 'data' with whichever 
      #information you need.
      data['message']='post added !!'
      response.write(json.dumps(data))
      return response
   else:
      return HttpResponse("NO POST REQUEST HANDLE")

您的客户端接下来会根据HttpResponse 对象中写入的数据来处理该响应。

   complete: function(res, status) {
            //In here you can do whatever you want to modify your
            //HTML dynamically
            // the variable res contains the JSON object dumped in the
            // django HTTPResponse object.
            $("#message").text = res['message'];
    }

   error: function(res, status) {
            $("#message").text = "error handling ajax request";
    }

确保同时处理 error 和 complete 回调。

在我给出的示例中，您需要有一个以message 作为 id 的 HTML 元素，即：

<div id="message"></div>

【讨论】：

对于您的 add_post，您应该设置响应的 application/javascript mimetype：return HttpResponse(json.dumps(data), mimetype='application/javascript')

【解决方案2】：

您为什么不直接在成功返回中返回帖子的 HTML，然后使用 jQuery 将其附加到页面中应该出现的位置。这就是我通常在我的代码中所做的，它既快速又简单。对于更复杂的解决方案，您可能希望返回 JSON 对象列表并使用诸如骨干网之类的 JavaScript 框架

【讨论】：

感谢您的回复。这实际上是我想要避免的，手动构建 HTML。因为我有一个循环{% for object in object_list %} 在页面加载时显示所有帖子，我希望我能以某种方式重新运行它。我认为这样会更有机，而不是手动构建 HTML 并添加它。
不，这并不意味着您必须“手动”构建它。您可以拥有一个定义 1 个帖子的 HTML 的模板。这可以包含在{% for object in object_list %} 中。然后也在 ajax 保存视图中，成功后将模板呈现为新创建对象的字符串并返回生成的 HTML。 response = {'success': 1, 'html': mark_safe(render_to_string('my_template', context, context_instance=RequestContext(request)))}
@rabbid：如果通过单独的 AJAX 请求将该 Post 列表加载到页面中，“重新运行”也是可能的。然后，如果成功，您只需在保存 complete 函数中调用 Post 列表 AJAX。但我认为@Dominic 概述的方法更有效，因为您不需要提出任何额外的请求。
嗯，我想我明白你的意思，但我得先试试。非常感谢！

【解决方案3】：

这是虚拟方式；

views.py:

def add_post(request):
    error_msg = u"No POST data sent."
    post_instance = Post()
    if request.method == "POST":
        # I love Rock'nRoll
        return post_instance

 return HttpResponse(json.dumps({'status': 'success', 'object': post_instance}))

在模板部分使用$.getJSON 或$.ajax 从views.py 中捕获json 对象，如果是success，则.append() 将返回的post_instance 对象添加到列表中。

【讨论】：