这是 Real Python 和 Mr. 的合作作品。内森·尼科尔斯.
于 2014 年 9 月 5 日更新，使应用程序更加 RESTful。
欢迎。上次我们将 AJAX 添加到基本的 Django 通信应用程序中，以改善用户体验。由于我们消除了页面刷新，最终的结果是应用程序对最终用户来说反应更快、功能更强大。
如果您还记得的话，我们在教程结束时布置了一些家庭作业：到你了。我们需要处理更多事件。有了您新发现的 jQuery 和 AJAX 知识，您就可以将它们落实到位。我向最终应用程序添加了代码（您可以在此处下载），其中包含删除链接。您只需要添加一个事件来处理点击，然后调用一个函数，该函数使用 AJAX 向后端发送 POST 请求，以从数据库中删除该帖子。请遵循与我在本教程中相同的工作流程。我们下次会发布这个问题的答案。
所以，在CRUD方面，我们需要添加DELETE能力。我们将使用以下工作流程：
当用户点击删除链接时，需要在 JavaScript 文件中“处理”这个“事件”：
// Delete post on click
$("#talk").on('click', 'a[id^=delete-post-]', function(){
var post_primary_key = $(this).attr('id').split('-')[2];
console.log(post_primary_key) // sanity check
delete_post(post_primary_key);
});
单击时，我们获取帖子主键，并将其添加到id同时，一个新的帖子被添加到 DOM 中：
$("#talk").prepend("<li><strong>"+json.text+"</strong> - <em> "+json.author+"</em> - <span> "+json.created+
"</span> - <a id='delete-post-"+json.postpk+"'>delete me</a></li>");
我们还将主键作为参数传递给delete_post()函数，我们需要添加...
正如您可能猜到的那样，delete_post()函数处理 AJAX 请求：
function delete_post(post_primary_key){
if (confirm('are you sure you want to remove this post?')==true){
$.ajax({
url : "delete_post/", // the endpoint
type : "DELETE", // http method
data : { postpk : post_primary_key }, // data sent with the delete request
success : function(json) {
// hide the post
$('#post-'+post_primary_key).hide(); // hide the post on success
console.log("post deletion successful");
},
error : function(xhr,errmsg,err) {
// Show an error
$('#results').html("<div class='alert-box alert radius' data-alert>"+
"Oops! We have encountered an error. <a href='#' class='close'>×</a></div>"); // add error to the dom
console.log(xhr.status + ": " + xhr.responseText); // provide a bit more info about the error to the console
}
});
} else {
return false;
}
};
将此代码与create_post()功能。有什么不同？
注意条件。这confirm()方法显示一个对话框，用户必须在其中单击“确定”或“取消”。由于此过程实际上会从数据库中删除帖子，因此我们只想确保用户没有意外单击删除。这只是让他们有机会在发送请求之前取消。
这些对话框并不是处理此问题的最优雅的方式，但它很实用。测试一下。
另外，由于我们要删除帖子，因此我们使用“DELETE”作为 HTTP 方法。
请记住，某些较旧的浏览器仅支持 GET 和 POST 请求。如果您知道您的应用程序将在某些旧版本的 Internet Explorer 上使用，您可以使用后隧道作为解决方法。
现在，让我们转向服务器端并更新 Django URL 和视图。请求发送到服务器端，首先由urls.py:
# Talk urls
from django.conf.urls import patterns, url
urlpatterns = patterns(
'talk.views',
url(r'^$', 'home'),
url(r'^create_post/$', 'create_post'),
url(r'^delete_post/$', 'delete_post'),
)
设置 URL 后，请求将被路由到适当的 Django 视图：
def delete_post(request):
if request.method == 'DELETE':
post = Post.objects.get(
pk=int(QueryDict(request.body).get('postpk')))
post.delete()
response_data = {}
response_data['msg'] = 'Post was deleted.'
return HttpResponse(
json.dumps(response_data),
content_type="application/json"
)
else:
return HttpResponse(
json.dumps({"nothing to see": "this isn't happening"}),
content_type="application/json"
)
如果请求方法是“DELETE”，那么我们从数据库中删除该帖子。如果该主键不存在会发生什么？这将导致意想不到的副作用。换句话说，我们会得到一个未正确处理的错误。看看您是否能找出如何捕获错误，然后使用 try/ except 语句正确处理它。
删除帖子后，我们创建一个响应字典，将其序列化为 JSON，然后将其作为响应发送回客户端。
将代码与create_post()功能。为什么我们做不到request.DELETE.get？嗯，因为 Django 不会像为 GET 和 POST 请求那样为 DELETE（或 PUT）请求构建字典。因此，我们使用get方法从查询字典班级。
笔记：如果我们使用单个视图来处理基于 HTTP 方法（GET、POST、PUT、DELETE）的不同场景，则该应用程序可能会更加 RESTful（并且代码可能会更干燥）。现在，我们对 GET、POST 和 DELETE 方法有不同的看法。这可以很容易地重构为一个视图：
def index(request): if request.method == 'GET': # do something elif request.method == "POST": # do something elif request.method == "DELETE": # do something else: # do something下次当我们将 Django Rest Framework 添加到项目中时，我们将深入解决这个问题。
回到delete_post()函数于main.js，我们如何处理成功的回调？
success : function(json) {
// hide the post
$('#post-'+post_primary_key).hide(); // hide the post on success
console.log("post deletion successful");
},
在这里，我们隐藏具有特定 id 的标签，然后将成功消息记录到控制台。例如，如果我们删除 id 为20，然后与 id 关联的标签post-20将被隐藏。这管用吗？测试一下。不应该。让我们解决这个问题...
打开索引.html模板。你在任何地方看到这个id吗？没有。让我们将其添加到开头<li>标签：
<li id='post-{{post.pk}}'>
现在测试一下。它应该有效。
不过，在我们结束之前，我们还需要在其他地方做出改变。如果您添加帖子然后立即尝试删除它会发生什么？它不应该工作，因为我们没有正确更新 DOM。返回到create_post()函数并更新用于向 DOM 添加新帖子的代码：
$("#talk").prepend("<li id='post-"+json.postpk+"'><strong>"+json.text+
"</strong> - <em> "+json.author+"</em> - <span> "+json.created+
"</span> - <a id='delete-post-"+json.postpk+"'>delete me</a></li>");
注意到区别了吗？测试一下。一切都很好。
Django Rest 框架。
在此之前，如果您有疑问，请发表评论并查看回购协议对于代码。