flask学习03表单

最新推荐文章于 2024-12-25 11:10:09 发布

Nolannk

最新推荐文章于 2024-12-25 11:10:09 发布

阅读量358

点赞数

CC 4.0 BY-SA版权

分类专栏： flask

本文链接：https://blog.youkuaiyun.com/joe_niu/article/details/78975395

flask 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了如何在Flask中处理表单，包括原生表单的创建与提交，使用flask-wtf扩展进行表单验证，利用flash显示消息，以及通过flask-moment进行时间本地化显示。示例涵盖了表单定义、模板渲染、校验逻辑以及错误提示的实现。

Flask表单

原生表单

添加模板文件login.html，内容如下：

 
<form method="post" action="{{ url_for('check') }}">

    用户名：<input name="username" type="text" />

    <input type="submit" value="立即登录" />

</form>

视图函数，如下：

 
# 登录

@app.route('/login/')

def login():

    return render_template('login.html')

# 校验

@app.route('/check/', methods=['POST'])

def check():

    return 'Hello %s !' % request.form['username']

将登录页面和校验的路由合并，如下：

@app.route('/login/', methods=['GET', 'POST'])

def login():

    if request.method == 'GET':

        return render_template('login.html')

    else:

        return 'Hello %s !' % request.form['username']

一个路由处理时，表单的action属性不用书写，默认提交到当前路由。

flask-wtf

说明：是一个用于表单处理的扩展库，提供了CSRF、校验等功能，使用非常方便
安装：pip install flask-wtf

使用：

定义表单类：

# 导入表单基类

from flask_wtf import FlaskForm

# 导入字段类型

from wtforms import StringField, SubmitField

# 导入验证器类

from wtforms.validators import DataRequired

# CSRF需要使用

app.config['SECRET_KEY'] = '123456'

# 定义表单类

class NameForm(FlaskForm):

    name = StringField('用户名', validators=[DataRequired()])

    submit = SubmitField('提交')

添加视图函数：

@app.route('/')

def index():

    # 创建表单对象

    form = NameForm()

    # 分配到模板中进行渲染

    return render_template('form.html', form=form)

模板文件中渲染表单：

{# 原生渲染 #}

<form>

    {# CSRF的隐藏字段 #}

    {{ form.hidden_tag() }}

    {# name字段，可以指定id、class等属性，定制显示效果 #}

    {{ form.name.label() }}{{ form.name(id='xxx', class='yyy') }}

    {# submit字段 #}

    {{ form.submit() }}

</form>

{# bootstrap渲染 #}

{% extends 'bootstrap/base.html' %}

{# 导入渲染工具 #}

{% import 'bootstrap/wtf.html' as wtf %}

{# 渲染表单 #}

{% block content %}

    <div class="container">{{ wtf.quick_form(form) }}</div>

{% endblock %}

表单校验

@app.route('/', methods=['GET', 'POST'])

def index():

    # return '表单使用'

    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)

POST重定向GET

@app.route('/', methods=['GET', 'POST'])

def index():

    # 创建表单对象

    form = NameForm()

    # 表单校验

    if form.validate_on_submit():

        session['name'] = form.name.data

        return redirect(url_for('index'))

    name = session.get('name')

    # 分配到模板中进行渲染

    return render_template('form.html', form=form, name=name)

常见字段类型

字段类型	说明
StringField	普通文本字段
SubmitField	提交按钮
PasswordField	密码文本字段
HiddenField	隐藏文本字段
TextAreaField	多行文本字段
DateField	文本字段，datetime.date格式
DateTimeField	文本字段，datetime.datetime格式
IntegerField	文本字段，值为整数
FloatField	文本字段，值为小数
BooleanField	复选框，值为True或False
RadioField	单选框
SelectField	下拉框
FileField	文件上传

常见验证器类

验证器	说明
DataRequired	确保字段有值
Email	邮箱地址
IPAddress	IP地址
	规定字符长度
	输入数值的范围
EqualTo	验证两个字段的一致性
	有效的URL
Regexp	正则验证

自定义字段验证：就是写一个'validate_字段名'的函数，如下：

# 定义表单类

class NameForm(FlaskForm):

    name = StringField('用户名', validators=[DataRequired()])

    submit = SubmitField('提交')

    # 自定义字段验证函数，格式是写一个'validate_字段名'的函数

    def validate_name(self, field):

        if len(field.data) < 6:

            raise ValidationError('用户名长度不能少于6个字符')

flash消息显示

说明：

当用户请求发出后，用户状态发生了改变，需要给出提示、警告等信息时，通常可以通过弹窗的形式给出指示，用户可以根据提示进行下一步操作，也可手动取消显示。

使用：

在合适的时候书写flash消息，调用flash函数

@app.route('/', methods=['GET', 'POST'])

def index():

    # return '表单使用'

    # 创建表单对象

    form = NameForm()

    # 表单校验

    if form.validate_on_submit():

        last_name = session.get('name')

        # 原来有名字，并且与新的不同

        if last_name and last_name != form.name.data:

            # flash消息

            flash('大哥，又换签名了')

            flash('常换签名，才能吸引眼球')

        session['name'] = form.name.data

        return redirect(url_for('index'))

    name = session.get('name')

    # 分配到模板中进行渲染

    return render_template('form.html', form=form, name=name)

显示flash消息：

{# 获取所有的flash小，然后遍历显示 #}

{% for message in get_flashed_messages() %}

<div class="alert alert-warning alert-dismissible" role="alert">

    <button type="button" class="close" data-dismiss="alert"

            aria-label="Close"><span aria-hidden="true">&times;</span>      </button>

      {{message}}

 </div>

 {% endfor %}

若好多页面都有弹出消息，可以将flash消息放在基础模板中展示。

flask-moment

说明：专门负责时间本地化显示的扩展库，使用非常方便。
安装：pip install flask-moment

使用：

# 导入类库

from flask_moment import Moment

# 创建对象

moment = Moment(app)

from datetime import datetime, timedelta

@app.route('/moment/')

def mom():

    current_time = datetime.utcnow() + timedelta(seconds=-3600)

    return render_template('moment.html', current_time=current_time)

模板中显示

{# 简单的格式化显示 #}

<div>时间：{{ moment(current_time).format('LLLL') }}</div>

<div>时间：{{ moment(current_time).format('LLL') }}</div>

<div>时间：{{ moment(current_time).format('LL') }}</div>

<div>时间：{{ moment(current_time).format('L') }}</div>

{# 自定义格式化显示 #}

<div>自定义显示：{{ moment(current_time).format('YYYY-MM-DD') }}</div>

{# 时间差值显示 #}

<div>发表于：{{ moment(current_time).fromNow() }}</div>

{# 加载jQuery，因为moment.js依赖，使用bootstrap时可以省略 #} {{ moment.include_jquery() }} {# 加载moment.js #} {{ moment.include_moment() }} {# 设置中文显示 #} {{ moment.locale('zh-CN') }}

 
   > 格式化显示不要记忆，去官网查询即可。