4、flask第四站-表单

1、创建表单

    使用 Flask-WTF 时，每个 Web 表单都由一个继承自 Form 的类表示。这个类定义表单中的一组字段，每个字
段都用对象表示。字段对象可附属一个或多个验证函数。验证函数用来验证用户提交的输入值是否符合要求。

【hello.py】

# 一个简单的 Web 表单，包含一个文本字段和一个提交按钮from flask_wtf import FlaskForm    # Form 基类由 Flask-WTF 扩展定义    #作为表单类的基类    from wtforms import SubmitField,StringField    #字段直接从 WTForms 包中导入    #表单类的属性，字段    from wtforms.validators import DataRequired,Length    #验证函数直接从 WTForms 包中导入    #字段的验证函数，每一个字段都要有一个验证函数，但是submit例外    class NameForm(Form):        name = StringField('Input your name:',validators=[DataRequired()])        submit = SubmitField('Submit')

    这个表单中的字段都定义为类变量，类变量的值是相应字段类型的对象。在这个示例中，NameForm 表单中有
一个名为 name 的文本字段和一个名为 submit 的提交按钮。 StringField类表示属性为 type=”text” 的
元素。 SubmitField 类表示属性为 type=”submit” 的 元素。字段构造函数的第一个参数是
把表单渲染成 HTML 时使用的标号。

    StringField 构造函数中的可选参数 validators 指定一个由验证函数组成的列表，在接受用户提交的数据之
前验证数据。验证函数 Required() 确保提交的字段不为空。

WTForms 支持的 HTML 标准字段下表所示：

WTForms 内建的验证函数如下表所示：

2、把表单渲染成HTML

【form.html】( M)

{% extends "base.html" %}#继承基类{% import "bootstrap/wtf.html" as wtf %}导入wtf.quick_form用来快速生成表单{% 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) }}#快速生成，并且把表单信息传进去{% endblock %}

    import 指令的使用方法和普通 Python 代码一样，允许导入模板中的元素并用在多个模板中。导入的
bootstrap/wtf.html 文件中定义了一个使用 Bootstrap 渲染 Falsk-WTF 表单对象的辅助函数。

    wtf.quick_form() 函数的参数为 Flask-WTF 表单对象，使用 Bootstrap 的默认样式渲染传入的表单。

3、视图函数中处理表单 (V)

【views.html】

@app.route('/form/',methods = ['GET','POST'])#app.route 修饰器中添加的 methods 参数告诉 Flask 在 URL 映射中把这个视图函数注册为GET 和 POST def form():    name = None    #名字先空    form = NameForm()    #生成一个表单    if form.validate_on_submit():        name = form.name.data        form.name.data = ''    return render_template('form.html',form = form, name = name)    #渲染表单

    第一部分是页面头部，显示欢迎消息。这里用到了一个模板条件语句。 Jinja2
中的条件语句格式为 {% if condition %}…{% else %}…{% endif %}。

    如果条件的计算结果为 True，那么渲染 if 和 else 指令之间的值。如果条件的计算结果为False，则渲染
else 和 endif 指令之间的值。在这个例子中，如果没有定义模板变量 name，则会渲染字符串“Hello,
Stranger!”。内容区的第二部分使用 wtf.quick_form() 函数渲染NameForm 对象。

4、重定向与用户会话

    为什么要重定向会话呢？因为当用户提交的时候表单method是POST，POST会成为
浏览器最后的一个请求，当刷新的时候，POST会导致刷新的时候再次提交。所以，要进行
重定向，使其成为GET。Post/ 重定向 /Get 模式。

【views.html】( v )

from flask import [e-mail]('/form2/',methods = ['GET','POST'])def form2():    form = NameForm()    if form.validate_on_submit():        session['name'] = form.name.data    # 这里也不需要设置form.name.data = ''，因为已经重定向到别的url去了，下次再到这个界面会自动初始化为''        return redirect(url_for('hello'))    return render_template('form.html',form = form, name = session.get('name'))

    局部变量 name 用来存放表单中输入的有效名字，如果没有输入，其值为 None。如上述代码所示，在视图函
数中创建一个 NameForm 类实例用于表示表单。提交表单后，如果数据能被所有验证函数接受， 那么
validate_on_submit() 方法的返回值为 True，否则返回 False。这个函数的返回值决定是重新渲染表单还是
处理表单提交的数据。

5、Flash消息

让用户知道状态发生了变化

【views.html】

from flask import [e-mail]('/form3/',methods = ['GET','POST'])def form3():    form = NameForm()    if form.validate_on_submit():        old_name = session.get('name')        if old_name is not None and old_name != form.name.data :            flash('you have changed your name')        session['name'] = form.name.data        return redirect(url_for('hello'))    return render_template('form.html',form = form, name = session.get('name'))

    每次提交的名字都会和存储在用户会话中的名字进行比较，而会话中存储的名字是前一次在这
个表单中提交的数据。如果两个名字不一样，就会调用 flash() 函数，在发给客户端的下一个响应中显示一
个消息

在基模板里添加

【base.html】

{% block content %}<div class="container">    {% for message in get_flashed_messages() %}    <div class="alert alert-warning">        <button type="button" class="close" data-dismiss="alert">&times;</button>        {{ message }}    </div>    {% endfor %}    {% block page_content %}{% endblock %}</div>{% endblock %}  

    在模板中使用循环是因为在之前的请求循环中每次调用 flash() 函数时都会生成一个消息，所以可能有多个
消息在排队等待显示。 get_flashed_messages() 函数获取的消息在下次调用时不会再次返回，因此 Flash消息只显示一次，然后就消失了。