在Flask中，为了处理web表单，我们一般使用Flask-WTF扩展，它封装了WTForms，并且它有验证表单数据的功能
- 创建语句格式： startTime = DateTimeField('计划开始时间', validators=[DataRequired('不可为空')，EqualTo('nowTime',message='两次事件必须一致')]，format='%Y/%m/%d %H:%M:%S' render_kw={'placeholder':'2018-06-03 00:00:00', 'id': 'rz1','autocomplete': "off"}
html效果：
<label>计划开始时间</label>
<input autocomplete="off" class="form-control" id="rz1" name="startTime" placeholder="2018-06-03 00:00:00" required="" type="text" value="">
3. 页面展示效果：
解析：
DataTimeField是从wtforms包导入的字段类 from wtfms import SelectField, StringField, SubmitField, TextField, DateTimeField, FileField。。。
'计划开始时间'是input标签的lable
validators是验证器，验证输入值的合法性，以列表的形式封装各种验证函数，验证函数由wtforms.validators导入：from wtforms.validators import DataRequired
format指定展示格式
render_kw以字典的形式存放input标签的各种属性
form.py文件在项目中的位置：与逻辑层同级，即与view.py同级，以便于不同的功能块放不同的form表单
项目效果： 三个文件依次是创建蓝图 创建form表单 逻辑(视图)函数
创建表单部分代码案例：
from flask_wtf import Form
from wtforms import SelectField, StringField, SubmitField, TextField, DateTimeField, FileField, SelectMultipleField, TextAreaField, HiddenField
from wtforms.validators import DataRequired class TaskinfoAdd(Form):
taskName = StringField('任务名称：', [DataRequired('任务名称不能为空')], render_kw={'placeholder': '任务名称', 'autocomplete': 'off'})
taskInfo = TextAreaField('详情描述：', render_kw={'placeholder': '任务描述...', 'autocomplete': 'off'})
urgentId = SelectField('紧急程度：', validators=[DataRequired('请选择紧急程度')], coerce=int, render_kw={'style': 'width:110px'})
resPeople = StringField('责任人：', [DataRequired('责任人不能为空')], render_kw={'class': 'res-people', 'placeholder': '责任人', 'style': 'width:110px', 'data-toggle':"modal", 'data-target':"#myModal2"})
exePeople = StringField('参与人(多选)：', render_kw={'class': 'exe-people', 'placeholder': '参与人(多选)', 'style': 'width:300px'})
sharePeople = StringField('共享人(多选)：', render_kw={'placeholder': '共享人(多选)', 'style': 'width:300px'})
startTime = DateTimeField('计划开始时间：', [DataRequired('开始时间不能为空')], format='%Y-%m-%d %H:%M:%S', render_kw={'placeholder':'2018-06-03 00:00:00', 'id': 'rz1', 'class': 'form-control calendar-control', 'autocomplete': "off"})
endTime = DateTimeField('计划完成时间：', [DataRequired('完成时间不能为空')], format='%Y-%m-%d %H:%M:%S', render_kw={'placeholder':'2019-06-06 00:00:00', 'id': 'rz2', 'class': 'form-control calendar-control', 'autocomplete': 'off'})
workTime = StringField('计划工时(分钟)：', [DataRequired('工时不能为空')], render_kw={'placeholder': ''}) loadFile = FileField('附件', render_kw={'multiple': 'multiple'})
submit = SubmitField('保存') class TaskinfoEdit(Form):
taskName = StringField('任务名称：', [DataRequired('任务名称不能为空')])
taskInfo = TextAreaField('详情描述：', render_kw={'placeholder': '任务描述...', 'autocomplete': 'off'})
urgentId = SelectField('紧急程度：', validators=[DataRequired('不可为空')], coerce=int, render_kw={'style': 'width:135px; display:inline-block'})
resPeople = StringField('责任人：', [DataRequired('责任人不能为空')], render_kw={'style': 'width:150px; display:inline-block'})
advanceId = SelectField('进 度：', coerce=int, render_kw={'placehoder': '50%', 'style': 'width:153px; display:inline-block'})
workTime = StringField('计划工时(分钟)：', [DataRequired('工时不能为空')], render_kw={'style': 'width:100px; display: inline-block'})
exePeople = StringField('参与人：', render_kw={'style': 'width:220px; display: inline-block'})
sharePeopleTo = StringField('共享人：', render_kw={'style': 'width:220px; display: inline-block'}) loadFile = FileField('上传附件:', render_kw={'multiple': 'multiple'})
download = StringField('下载附件:', render_kw={'placehoder': '无附件', 'style': 'background: white; height:23px; display: inline-block'}, id='download')
reason = StringField('超期原因：', render_kw={'placeholder': '超期原因...', 'autocomplete': 'off'})
submit = SubmitField('提交')
form.py
flask接收后端处理：
@task_mgm.route('/taskinfo_add', methods=['GET', 'POST'])
@login_required
def taskinfo_add_fun():
form1 = TaskinfoAdd()
form1.urgentId.choices = [(urgences.id, urgences.urgentName) for urgences in Urgence.query.all()]
if form1.validate_on_submit():
task = MgmTask(taskName=form1.taskName.data, urgentId=form1.urgentId.data, resPeople=form1.resPeople.data,
exePeople=form1.exePeople.data, sharePeopleTo=form1.sharePeople.data, startTime=form1.startTime.data,
endTime=form1.endTime.data, workTime=form1.workTime.data, taskInfo=form1.taskInfo.data,
createPeople=current_user.name)
# 替换汉语逗号
task.sharePeopleTo.replace('，', ',')
task.resPeople.replace('，', ',')
task.exePeople.replace('，', ',')
# 保存上传的文档
upload(form1, task)
try:
db.session.add(task)
db.session.commit()
except Exception as e:
logging.error(e)
return redirect(url_for('task_mgm.taskinfo_add_fun'))
return render_template('/task_mgm/taskinfo_mine.html', form1=form1, name=current_user.name, grade=current_user.grade)
# 编辑任务
@task_mgm.route('/taskinfo_editID=<int:num>', methods=['GET', 'POST'])
@login_required
def taskinfo_edit_fun(num):
task = MgmTask.query.get(num)
pageType = request.values.get('pageType')
formEdit = TaskinfoEdit(obj=task)
formEdit.urgentId.choices = [(urgences.id, urgences.urgentName) for urgences in Urgence.query.all()]
formEdit.advanceId.choices = [(advances.id, advances.name) for advances in Advance.query.all()]
if task.fileName:
formEdit.download.data = task.fileName
if formEdit.validate_on_submit():
formEdit.populate_obj(task) # 重新填充表单
if formEdit.advanceId.data == 5:
task.finishTime = datetime.now()
upload(formEdit, task)
try:
db.session.add(task)
db.session.commit()
except Exception as e:
logging.error(e)
page = request.args.get('page', 1, type=int)
pagination = Comment.query.filter(Comment.taskId == num).order_by(Comment.createTime.desc()).paginate(
page, per_page=225, error_out=False)
comments = pagination.items
return render_template('/task_mgm/taskinfo_edit.html', formEdit=formEdit, header='编辑任务', comments=comments, pagination=pagination, pageType=pageType, name=current_user.name, grade=current_user.grade)
view.py
html前端可以继承bootstrap的wtf.html 也可以直接写：
继承：
{% import "bootstrap/wtf.html" as wtf %}
<div class="modal-body" style="margin-top: 20px">{{ wtf.quick_form(form1, form_type='horizontal', horizontal_columns=('md', 3, 8)) }}
<button type="button" class="btn btn-default" data-dismiss="modal"
style="position:relative; margin-left: 460px; bottom:49px;">关闭
</button>
</div>
不继承
<form method="post">
{#设置csrf_token#}
{{ form.csrf_token() }}
{{ form.username.label }}{{ form.username }}<br>
{{ form.password.label }}{{ form.password }}<br>
{{ form.password2.label }}{{ form.password2 }}<br>
...
{{ form.input }}<br>
</form>
WTForms支持的HTML标准字段:
| 字段对象 | 说明 |
|---|---|
| StringField | 文本字段 |
| TextAreaField | 多行文本字段 |
| PasswordField | 密码文本字段 |
| HiddenField | 隐藏文件字段 |
| DateField | 文本字段，值为 datetime.date 文本格式 |
| DateTimeField | 文本字段，值为 datetime.datetime 文本格式 |
| IntegerField | 文本字段，值为整数 |
| DecimalField | 文本字段，值为decimal.Decimal |
| FloatField | 文本字段，值为浮点数 |
| BooleanField | 复选框，值为True 和 False |
| RadioField | 一组单选框 |
| SelectField | 下拉列表 |
| SelectMutipleField | 下拉列表，可选择多个值 |
| FileField | 文件上传字段 |
| SubmitField | 表单提交按钮 |
| FormField | 把表单作为字段嵌入另一个表单 |
| FieldList | 一组指定类型的字段 |
WTForms常用验证函数:
| 验证函数 | 说明 |
|---|---|
| DataRequired | 确保字段中有数据 |
| EqualTo | 比较两个字段的值，常用于比较两次密码输入 |
| Length | 验证输入的字符串长度 |
| NumberRange | 验证输入的值在数字范围内 |
| URL | 验证URL |
| AnyOf | 验证输入值在可选列表中 |
| NoneOf | 验证输入值不在可选列表中 |
提示：
使用Flask-WTF需要配置参数SECRET_KEY。
CSRF_ENABLED是为了CSRF（跨站请求伪造）保护。 SECRET_KEY用来生成加密令牌，当CSRF激活的时候，该设置会根据设置的密匙生成加密令牌