版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
前言
这篇文章中完成了对文章的查看,上一篇文章中实现了markdown编辑,这篇文章中就来实现一下对文章的增,删,改.
感谢大神的教程:Django搭建个人博客.
注:本篇文章会用到之前学过的ModelForm以及数据的增删改查,还有就是模板的继承与导入,当然了,这些都是最基本的知识.
一.发表新文章
在之前插入文章都是在后天来完成的,但是这样并不是我们想要的,我们希望可以在前端中进行文章的编写.
1.创建ModelForm类:
在article中创建一个forms.py文件:
# 引入表单类
from django import forms
# 引入文章模型
from article.models import ArticlePost
# 写文章的表单类
# 在ArticlePost模型中,created和updated字段是自动生成的,不需要填入
# author字段暂时固定为id=1的管理员用户,也不需要填写
# 所以需要填写的就是title和body
class ArticlePostForm(forms.ModelForm):
class Meta:
# 指明数据模型来源
model = ArticlePost
fields = ('title','body')
我们知道,ModelForm既可以做数据库操作,又可以做验证.
2.编写视图函数
views.py:
# 写文章的视图函数
def article_create(request):
# 判断用户是否提交数据
if request.method == "POST":
# 将提交的数据赋值到表单实例中
article_post_form = ArticlePostForm(data=request.POST)
# 判断提交的数据是否满足模型的需求
if article_post_form.is_valid():
# 保存数据,但暂时不提交到数据库中
new_article = article_post_form.save(commit=False)
# 指定数据库中,id=1的用户为作者
# 如果你进行过删除数据表的操作,可能会找不到id=1的用户
# 此时请重新创建用户,并传入此用户id
new_article.author = User.objects.get(id=1)
# 将新文章保存到数据库中
new_article.save()
return redirect('article:article_list')
else:
return HttpResponse('表单内容有误,请重新填写')
# 如果用户请求获取数据
else:
# 创建表单实例
article_post_form = ArticlePostForm()
context = {'article_post_form':article_post_form}
return render(request,'article/create.html',context)
这个逻辑在之前也写过,也是很好理解的,在这里就不做过多了说明了.
3.创建前端页面
article/create.html:
{% extends "base.html" %}
{% load staticfiles %}
{% block title %}}写文章{% endblock %}
{% block content %}
<!-- 写文章表单 -->
<div class="container">
<div class="row">
<div class="col-12">
<br>
<!-- 提交文章的表单 -->
<form method="post" action=".">
<!-- Django中需要POST数据的地方都必须有csrf_token -->
{% csrf_token %}
<!-- 文章标题 -->
<div class="form-group">
<!-- 标签 -->
<label for="title">文章标题</label>
<!-- 文本框 -->
<input type="text" class="form-control" id="title" name="title">
</div>
<!-- 文章正文 -->
<div class="form-group">
<label for="body">文章正文</label>
<!-- 文本区域 -->
<textarea type="text" class="form-control" id="body" name="body" rows="12"></textarea>
</div>
<!-- 提交按钮 -->
<button type="submit" class="btn btn-primary">完成</button>
</form>
</div>
</div>
</div>
{% endblock %}
4.优化
在header.html中加入:
<li class="nav-item">
<a class="nav-link" href="{% url 'article:article_create' %}">写文章</a>
</li>
这样,一个基本的写文章功能就完成了.来看效果:
二.删除文章
删除比较简单,只要获取到想要删除的数据,然后在数据库中删除就行了.所以这里就不写具体过程了,直接写上最终的结果.
1.编写视图函数
views.py:
def article_safe_delete(request,id):
if request.method == "POST":
article = ArticlePost.objects.get(id=id)
article.delete()
return redirect("article:article_list")
else:
return HttpResponse("仅允许POST请求")
2.配置url
article/url.py:
path('article-safe-delete/<int:id>/',views.article_safe_delete,name='article_safe_delete'),
3.增加弹窗
在base.html中增加:
<script src="/static/layer/layer.js"></script>
4.编写删除函数
article/detail.html:
<!-- extends表明此页面继承自 base.html 文件 -->
{% extends "base.html" %}
{#加载静态文件#}
{% load staticfiles %}
{#写入title#}
{% block title %}
文章详情
{% endblock %}
{#写入自定义content#}
{% block content %}
<div class="container">
<div class="row">
<!-- 标题及作者 -->
<h1 class="col-12 mt-4 mb-4">{{ article.title }}</h1>
<div class="col-12 alert alert-success">作者：{{ article.author }}
.<a href="#" onclick="confirm_safe_delete()">删除文章</a>
.<a href="{% url 'article:article_update' article.id %}">编辑文章</a>
</div>
<!-- 文章正文 -->
<div class="col-12">
<p>{{ article.body|safe }}</p>
</div>
</div>
</div>
{# 新增一个隐藏的表单 #}
<form
style="display:none;"
id="safe_delete"
action="{% url 'article:article_safe_delete' article.id %}"
method="POST"
>
{% csrf_token %}
<button type="submit">发送</button>
</form>
<script>
{# 删除文章函数 #}
function confirm_safe_delete() {
layer.open({
title: "确认删除",
content: "确认删除这篇文章吗？",
yes: function(index, layero) {
$('form#safe_delete button').click();
layer.close(index);
}
})
}
</script>
{% endblock %}
三.修改文章
修改文章也就是更新数据,这个和增加数据其实差不多,只不过更新数据需要先获取到数据.功能也比较简单,所以直接把代码记录下来:
1.编写视图函数
views.py:
# 更新文章
def article_update(request,id):
"""
更新文章的视图函数
通过
POST方法提交表单,更新title,body字段
GET方法进入初始表单页面
id:是文章的id
"""
# 获取需要修改的具体文章对象
article = ArticlePost.objects.get(id=id)
# 判断用户是否为POST提交表单数据
if request.method == "POST":
article_post_form = ArticlePostForm(data=request.POST)
# 判断提交的数据是否满足模型的需求
if article_post_form.is_valid():
article.title = request.POST.get('title')
article.body = request.POST.get('body')
article.save()
# 完成后返回到修改后的文章中,需要传入文章的id值
return redirect("article:article_detail",id=id)
else:
return HttpResponse('表单内容有误,请重新填写')
# 如果是get请求
else:
article_post_form = ArticlePostForm()
context = {'article': article, 'article_post_form': article_post_form}
# 将响应返回到模板中
return render(request, 'article/update.html', context)
2.编写模板
article/update.html
{% extends "base.html" %} {% load staticfiles %}
{% block title %} 更新文章 {% endblock title %}
{% block content %}
<div class="container">
<div class="row">
<div class="col-12">
<br>
<form method="post" action=".">
{% csrf_token %}
<div class="form-group">
<label for="title">文章标题</label>
<!-- 在 value 属性中指定文本框的初始值为旧的内容，即 article 对象中的 title 字段 -->
<input type="text" class="form-control" id="title" name="title" value="{{ article.title }}">
</div>
<div class="form-group">
<label for="body">文章正文</label>
<!-- 文本域不需要 value 属性，直接在标签体中嵌入数据即可 -->
<textarea type="text" class="form-control" id="body" name="body" rows="12">{{ article.body }}</textarea>
</div>
<button type="submit" class="btn btn-primary">完成</button>
</form>
</div>
</div>
</div>
{% endblock content %}
3.配置url
article/url.py:
path('article-update/<int:id>/',views.article_update,name='article_update'),
4.增加修改按钮
article/detail.html中添加修改文章的入口:
<div class="col-12 alert alert-success">作者：{{ article.author }}
· <a href="#" onclick="confirm_delete()">删除文章</a>
· <a href="{% url "article:article_update" article.id %}">编辑文章</a>
</div>
总结
这样,文章的增删改查基本都完成.用到的知识只要就是模板的继承与导入,数据表的创建以及ModelForm的使用.
写在最后
本文是个人的一些学习笔记,如有侵权,请及时联系我进行删除,谢谢大家.