使用 Django 模板标签响应 ajax
using Django template tags in response to ajax
我使用 Ajax 来更新对象列表,比方说每次单击按钮时。但我想使用 Django 模板标签来生成列表的每个项目。问题是我必须将 JsonResponse
发送回 JavaScript,但是在那里,我不能使用这些标签。
我必须将对象属性作为 json 发送。我在 Ajax:
中被普通的 html 困住了
...
success: function (json) {
if (json.new_messages.length) {
for (let m of json.new_messages) {
$('#messages-list').append("<li>"+m.sender_name+" "+m.content+"</li>");
}
}
},
我发现解决此问题的一种方法是先呈现模板,然后发送生成的文本作为响应。
在模板文件中,只包含需要在Ajax中使用的html。没有额外的 html 标签。在这里你可以使用所有的 Django 标签和过滤器。例如:
{% for m in messages_list %}
<li>
<b>{{ m.sender.profile.get_short_name }}</b>
({{ m.send_time|time:"H:i" }}):
{{ m.content }}
{% if m.sender == user %}
{% if m.is_seen %}
<b><small>✓✓</small></b>
{% else %}
<b><small>✓</small></b>
{% endif %}
{% endif %}
</li>
{% empty %}
<li>No messages here yet...</li>
{% endfor %}
在视图中,使用名为 render_to_string
的函数,呈现模板并在 json 响应的上下文中发送它:
response = render_to_string("just_list.html", context={"messages_list": new_messages})
return JsonResponse({"messages": response})
然后就可以很方便的用在Ajax:
...
success: function (json) {
$('#messages-list').append(json.messages);
},
我使用 Ajax 来更新对象列表,比方说每次单击按钮时。但我想使用 Django 模板标签来生成列表的每个项目。问题是我必须将 JsonResponse
发送回 JavaScript,但是在那里,我不能使用这些标签。
我必须将对象属性作为 json 发送。我在 Ajax:
中被普通的 html 困住了...
success: function (json) {
if (json.new_messages.length) {
for (let m of json.new_messages) {
$('#messages-list').append("<li>"+m.sender_name+" "+m.content+"</li>");
}
}
},
我发现解决此问题的一种方法是先呈现模板,然后发送生成的文本作为响应。
在模板文件中,只包含需要在Ajax中使用的html。没有额外的 html 标签。在这里你可以使用所有的 Django 标签和过滤器。例如:
{% for m in messages_list %}
<li>
<b>{{ m.sender.profile.get_short_name }}</b>
({{ m.send_time|time:"H:i" }}):
{{ m.content }}
{% if m.sender == user %}
{% if m.is_seen %}
<b><small>✓✓</small></b>
{% else %}
<b><small>✓</small></b>
{% endif %}
{% endif %}
</li>
{% empty %}
<li>No messages here yet...</li>
{% endfor %}
在视图中,使用名为 render_to_string
的函数,呈现模板并在 json 响应的上下文中发送它:
response = render_to_string("just_list.html", context={"messages_list": new_messages})
return JsonResponse({"messages": response})
然后就可以很方便的用在Ajax:
...
success: function (json) {
$('#messages-list').append(json.messages);
},