通俗讲,web表单就是做浏览器上可以提交用户输入的内容的地方,比如注册时的用户名/密码等。
当然,表单的设计会涉及到表单内容的判断、用户输入内容的存储。这里涉及的有对输入内容不为空的Required()函数,存储用户内容的session模块。
首先来看让网页上显示出表单输入框及提交按钮的代码(加到hello.py中的):
from flask.ext.wtf import Form # 导入扩展模块
from wtforms import StringField, SubmitField # 导入需要使用的,WTFroms支持的HTML标准字段
from wtforms.validators import Required # 验证函数,确保字段不为空
class NameForm(Form):
name = StringField('What is your name?', validators=[Required()]) # 用户可以输入内容的文本框,值被name变量接收
submit = SubmitField('Submit') # 提交按钮
在index.html中试用Flask-WTF和Flask-Bootstrap渲染表单:
{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{% block title %}Flasky{% endblock %}
{% block page_content %}
<div class="page-header">
<h1>Hello, {% if name %}{{ name }}{% else %}Stranger{% endif %}!</h1>
</div>
{{ wtf.quick_form(form) }} #使用wtf.quick_form()函数渲染NameForm对象
{% endblock %}
更新hello.py中路由方法:
@app.route('/', methods=['GET', 'POST']) #告诉Flask做URL映射中把这个视图函数注册为GET和POST请求的处理程序
def index():
name = None
form = NameForm()
if form.validate_on_submit(): #如果输入的数据验证通过,validate_on_submit()方法返回True
name = form.name.data #赋值给局部变量
form.name.data = ' ' #将表单字段清空
return render_template('index.html', form=form, name=name) #渲染模板,带有变量name的值
这个时候把服务器跑起来,就可以看到显示表单的网页了:
输入数据提交后,会更新显示内容:
补充内容:
1、WTForms支持的HTML标准字段
2、WTForms验证函数
字段就是定义输入框可以输入的内容类型,验证函数就是对输入内容的限制,数据通过验证函数的验证了,才能提交成功。这两个表中的字段和函数我都试着用了一下,大部分都可以直接用起来,但有几个不知道怎么用,先记下来:HiddenField,RadioField,SelectField,SelectMultipleField,FormField。