flask 表单

表单

在Web程序中,表单时和用户交互最常见的方式之一。用户注册、登录、撰写文章、编辑设置,无一不用到表单。不过,表单的处理不简单。要创建表单,验证用户输入的内容,向用户显示错误提示,还要获取并保存数据。

WTForms可以做这些事情,WTForms是一个使用python编写的表单库,它使得表单的定义、验证(服务器端)和处理变得非常轻松。下面学习一下web程序中处理表单的方法和技巧。

HTML表单

在html中,表单通过<form>标签来创建,表单中的字段使用<input>标签定义。下面是一个表单:

<form method="post">
    <label for="username">Username</label><br>
    <input type="text" name="username" placeholder="Ross Gellar"><br>
    <label for="password">Password</label><br>
    <input type="password" name="password" placeholder="19870308"><br>
    <input id="remember" name="remember" type="checkbox" checked>
    <label for="remember"><small>Remember me</small></label><br>
    <input type="submit" name="submit" value="Log in">
</form>

在html表单中,我们创建<input>标签标示各种输入字段,<label>标签则用来定义字段的标签文字。可以在<from>和<input>标签中使用各种属性来对表单进行设置。

上面的表单被浏览器解析后会生成两个输入框,一个勾选框和一个提交按钮。

运行程序后,在浏览器中输入URL:127.0.0.1:5000/html,会触发视图函数,页面如下:

示例相关文件:
appFrom.py:
#encoding=utf-8
from flask import Flask,render_template,flash,redirect,url_for,session
import os#用不到

app = Flask(__name__)
app.secret_key = os.getenv('SECRET_KEY','secret string')#用不到

@app.route('/html',methods=['GET','POST'])
def html():
    return render_template('pure_html.html')

if __name__ == '__main__':
    app.run(debug=True)
基模板baseFrom.html:
<!DOCTYPE html>
<html>
<head>
    {% block head %}
        {% block metas %}
        <meta charset="UTF-8">
        {% endblock metas %}

        <title>{% block title %}Form - HelloFlask{% endblock %}</title>
        <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='favicon.ico') }}">
        {% block styles %}
            <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
        {% endblock styles %}
    {% endblock head %}
</head>
<body>
<nav>
    {% block nav %}
        <ul>
            <li><a href="{{ url_for('html') }}">Home</a></li>
        </ul>
    {% endblock %}
</nav>
<main>
    {% for message in get_flashed_messages() %}
        <div class="alert">
            {{ message }}
        </div>
    {% endfor %}
    {% block content %}{% endblock %}
</main>
<footer>
    {% block footer %}
        <small> &copy; 2019 <a href="https://www.cnblogs.com/xiaxiaoxu/" title="xiaxiaoxu's blog">夏晓旭的博客</a> /
            <a href="https://github.com/xiaxiaoxu/hybridDrivenTestFramework" title="Contact me on GitHub">GitHub</a> /
            <a href="http://helloflask.com" title="A HelloFlask project">Learning from GreyLi's HelloFlask</a>
        </small>
    {% endblock %}
</footer>
{% block scripts %}{% endblock %}
</body>
</html>

存放表单的子模板:pure_html.html

{% extends 'baseForm.html' %}

{% block content %}
<h2>Pure HTML Form</h2>

<form method="post">
    <label for="username">Username</label><br>
    <input type="text" name="username" placeholder="Ross Gellar"><br>
    <label for="password">Password</label><br>
    <input type="password" name="password" placeholder="19870308"><br>
    <input id="remember" name="remember" type="checkbox" checked>
    <label for="remember"><small>Remember me</small></label><br>
    <input type="submit" name="submit" value="Log in">
</form>
{% endblock %}

WTForms支持在python中使用类定义表单,然后通过类定义生成对应的HTML代码,这种方式更方便,易于重用。因此,除非是非常简单的程序,或者想让表单的定义更加灵活,否则不会再模板中直接使用HTML编写表单。

原文地址:https://www.cnblogs.com/xiaxiaoxu/p/10468198.html