前面的文章已经把模板、模型、视图、表单等知识点逐一讲解，大家已经熟悉它们具体用法。但如何将其串联起来还一筹莫展。本篇文章分享我之前做过的一个小项目，帮助大家抹开这一层迷雾。
1 想做什么？
我分享的项目是一个社工库查询系统。大家不要一拿到源码，就直接去阅读。建议先思考下，如果让我来设计社工库查询系统，我要如何实现？
我就先阐述我思考的内容。既然项目是一个查询系统，那么重点在于查询。众所周知，查询数据则是执行 SQL 语句来从数据库中获取数据。SQL 查询语句一般使用表中的字段作为查询条件。哪些能作为查询条件呢？先让我们来看看数据库表是怎么定义的？
2 数据库表
数据库中只有一个表，名为 Socialusers。它的创建语句是：
Create table if not exists `SocialUsers` (
`id` INTEGER PRIMARY KEY,
`username` varchar(64),
`password` varchar(64),
`chineseName` varchar(64) ,
`email` varchar(64) ,
`QQ` varchar(15) ,
`weibo` varchar(300),
`identity_number` varchar(25),
`cell_phone` varchar(20),
`ip_address` varchar(100),
`college` varchar(60),
`living_place` varchar(200),
`source` varchar(50),
`remarks` varchar(400)
);
表中一共有 13 个字段，其中有 9 个字段的内容属于敏感字段，涉及到个人账号安全问题。因此，我将这 9 个字段，分别是 username、password、chineseName、email、QQ、identity_number、cell_phone、college、source 作为查询条件。
那么系统最终的效果是根据查询条件和用户输入的内容来查询数据。如果数据库匹配到数据，就通过表格形式打印数据。反之则提醒用户查询不到数据（查询不到数据应该值得庆幸的，说明你的账号数据没有被泄露）。
我将查询条件以下拉框的形式显示，让用户可以自行选择查询条件。查询内容以文章输入框展示，提供用户输入数据的接口。到这里可以回答之前的想要做什么的问题了。我们最终要实现的页面效果如下：
3 模型建立
数据库已经有了表，我直接使用 Django 自带工具生成 Socialusers 模型。这一步就省略不讲，如果你对这步操作不是很熟悉，可以阅读《Django 学习笔记之使用旧数据库》的内容。
最终生成的模型如下：
class Socialusers(models.Model):
id = models.IntegerField(blank=True, primary_key=True)
username = models.CharField(max_length=64, blank=True, null=True)
password = models.CharField(max_length=64, blank=True, null=True)
# Field name made lowercase.
chinesename = models.CharField(db_column='chineseName', max_length=64, blank=True, null=True)
email = models.CharField(max_length=64, blank=True, null=True)
# Field name made lowercase.
qq = models.CharField(db_column='QQ', max_length=15, blank=True, null=True)
weibo = models.CharField(max_length=300, blank=True, null=True)
identity_number = models.CharField(max_length=25, blank=True, null=True)
cell_phone = models.CharField(max_length=20, blank=True, null=True)
ip_address = models.CharField(max_length=100, blank=True, null=True)
college = models.CharField(max_length=60, blank=True, null=True)
living_place = models.CharField(max_length=200, blank=True, null=True)
source = models.CharField(max_length=50, blank=True, null=True)
remarks = models.CharField(max_length=400, blank=True, null=True)
class Meta:
managed = True
db_table = 'SocialUsers'
注意下 chinesename 和 qq 这两个属性。我们在数据库中的定义是 chineseName 和 QQ。而 Django 在生成的模型时，自动将大写转为化小写。因此，当我们在使用 Socialusers 这两个属性时，要注意它们的定义已经改变，属性的定义全是小写的。
4 表单实现
表单的实现由两种方式:一种是根据 model 生成 Form，另一种是自定义 Form。我分别把这两种方式实现。你可以对比下这两种写法的差异，以及如何给表单指定 bootstrap CSS 样式的。
4.1 根据 model 生成 Form
在 app 目录下新建文件夹 forms 以及文件 forms.py 。forms.py 主要存放表单的定义，实现代码如下：
# forms.py
CONDITION_CHOICES = (
('username', '用户名'),
('password', '密码'),
('chineseName', '姓名'),
('email', '邮箱'),
('QQ', 'QQ'),
('identity_number', '身份证'),
('cell_phone', '电话'),
('college', '大学'),
('source', '来源'),
)
class QueryUserForm(forms.Form):
condition = forms.CharField( # 也可以定义为 ChoiceField
max_length=20,
widget=forms.Select(choices=CONDITION_CHOICES,
attrs={'class':"form-control",
'title':"query condition",
'name':'condition',
}),
localize=('username', '用户名')
)
queryContent = forms.CharField(
max_length=100,
widget=forms.TextInput(attrs={'class': 'form-control is-invalid',
'name': 'queryContent',
'placeholder': '请输入需要要查询的内容...'
}),
error_messages={'required': '查询内容不能为空 !'}
)
其中， widget 是指定字段呈现样式，如 condition 被指定呈现下拉框 Select；localize 是设置初始化值；error_messages 是错误提示形式。attrs 是为呈现的组件指定一些属性，如 CSS 样式、name 等。这部分内容，后面的文章会做详细讲解。
4.2 自定义 Form
为了更好区分模型，我在 models.py 中新建一个模型来代替之前的 Socialusers 模型。
# models.py
# 用于表单查询的 model
CONDITION_CHOICES = (
('username', '用户名'),
('password', '密码'),
('chineseName', '姓名'),
('email', '邮箱'),
('QQ', 'QQ'),
('identity_number', '身份证'),
('cell_phone', '电话'),
('college', '大学'),
('source', '来源'),
)
class QueryUser(models.Model):
condition = models.CharField(max_length=20, choices=CONDITION_CHOICES)
queryContent = models.CharField(max_length=100)
def __str__(self): # __unicode__ on Python 2
return self.condition
Form 的实现代码如下：
# forms.py
class QueryUserForm(ModelForm):
class Meta:
model = QueryUser
fields = ['condition', 'queryContent', ]
# 指定呈现样式字段、指定 CSS 样式
widgets = {
'condition': Select(attrs={'class':"form-control",
'title':"query condition",
'name':'condition',
}),
'queryContent':TextInput(attrs={'class': 'form-control is-invalid',
'name': 'queryContent',
'placeholder': '请输入需要要查询的内容...'
})
}
localized = {
'condition':('username', '用户名'),
'queryContent':123
}
# 自定义错误信息
error_messages = {
'queryContent':{
'required': '查询内容不能为空 !',
}
}
各个字段的含义跟第一种实现方式类似，我就不重复说明。
5 模板创建
我创建名为 templates 文件夹来存放 HTML 文件。其中 index.html 是主页面，也是我们查询数据的页面。因为我前端框架使用的是 bootstrap，所以需要加载一些库。我为了满足在电脑无网络的状态也能使用的需求。我将其 bootstrap 所用到的库到打包到 static 目录下。
代码比较多，我只把重点内容贴出来。详细代码可以到 Github 网站上查看完整代码。
{% load staticfiles %}
社工库查询系统
在 html 代码中，我直接将 form 标签直接写出来，里面的 Select 和 Input 标签通过 Django Form 来填充。下拉框使用表单的 condition 属性，即 {{ form.condition }} 来填充 ，输入框也是使用 {{ form.queryContent }} 来填充。当它们渲染的时候，会自动被解析为 Select 和 input 控件。
6 视图
我设定是用户提交表单地址不改变。所以表单数据会被提交到原来的页面。因此，在视图的工作是拦截表单，并截取里面的内容。最后将查询结果返回给 HTML 页面。
# views.py
def index(request):
templateView = 'index.html'
if request.method == 'GET':
form = QueryUserForm(request.GET)
# 验证表单
if form.is_valid():
# 过滤需要的数据, 获取查询条件和查询内容
condition = form.cleaned_data['condition']
keywords = form.cleaned_data['queryContent']
print('condition == ' + condition)
print('keywords == ' + keywords)
# 查询数据...
return render(request, templateView, {'form': form})
# 直接访问主页, 显示的内容
else:
return render(request, templateView, {'form': form})
系统的基本框架已经搭建差不多。因为文章篇幅关系，一部分内容下篇文章讲解。下篇文章主要是如何查询数据、如何根据查询结果显示不同内容、如何将数据呈现出来。
7 写在最后
我新建一个 Python Web 学习交流 QQ 群，群号：701534112。欢迎大家加群，一起交流，一起学习，一起进步。
往前 Django 学习笔记文章
Django 学习笔记之环境搭建
Django 学习笔记之初始
Django 学习笔记之视图与URL配置
Django 学习笔记之模板
Django 学习笔记之模型（上）
Django 学习笔记之模型（下）
Django 学习笔记之后台管理
Django 学习笔记之模型表单
Django 学习笔记之使用旧数据库
本文原创发布于微信公众号「极客猴」，欢迎关注第一时间获取更多原创分享