表单

在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编写表单。

flask 表单的更多相关文章

  1. flask表单,orm,csrf

    flask表单是flask中最基本的功能. 它是负责HTML页面中数据采集的部分,它由三部分组成:表单标签,表单域,表单按钮组成,通过表单用户输入的数据提交给服务器. flask表单封装了WTForm ...

  2. flask表单提交的两种方式

    一.通用方式 通用方式就是使用ajax或者$.post来提交. 前端html <form method="post" action="/mockservice&qu ...

  3. Flask表单(Flask-WTF)

    1.request.from获取POST表单数据 # hello.py #coding:utf-8 from flask import Flask,request,render_template ap ...

  4. Flask表单(form)的应用

    导入模块request模块 #指定请求方式,使用methods属性 @app.route("/",methods=['GET','POST']) def index(): #判断c ...

  5. flask表单标签

    环境:python2.7+flask+flask_wtf 内容:flask的部分常用表单标签 test.py # -*- coding: utf-8 -*- # flask web_form 表单控件 ...

  6. Flask从入门到精通之Flask表单渲染成HTML

    表单字段是可调用的,在模板中调用后会渲染成HTML.假设视图函数把一个NameForm 实例通过参数form 传入模板,在模板中可以生成一个简单的表单,如下所示: <form method=&q ...

  7. Flask从入门到精通之Flask表单

    Flask请求对象包含客户端发出的所有请求信息.其中,request.form 能获取POST 请求中提交的表单数据.尽管Flask 的请求对象提供的信息足够用于处理Web 表单,但有些任务很单调,而 ...

  8. flask表单flask-wtf

    一.安装pip install flask-wtf 二.创建一个flask的项目引入相对应的包 from flask import Flask,render_template import flask ...

  9. Flask表单验证

    学习内容:①判断请求方式(request.method) from flask import Flask,render_template,request app = Flask(__name__) @ ...

随机推荐

  1. 不能往Windows Server 2008 R2 Server中复制文件的解决方法

    目前一直直接往Windows 2008 R2 Server中复制文件(暂时还没有搭建ftp服务),突然不能复制了,于是百度找到了解决方法,特此记录(记忆). 1.在任务管理器中找到“rdpclip.e ...

  2. java各版本简单对比

    1995.5 Oak ——>java1.0 提出 write once run anywhere 1996.1 jdk1.0  jvm Sun Classic VM 1997.2 JDK1.1 ...

  3. VS Code 管理 .NET Core解决方案

    本练习要使用Visual studio code完成一个包含多个项目的解决方案,包括类库和Web项目.结合Visual Studio Code和.NET Core CLI,创建项目结构如下: pied ...

  4. mysql show prifile基本详解

    show profile默认情况下,参数处于关闭状态,并保存最近15次的运行结果查看profile是否开启 show variables like '%profi%';开启profile记录功能 se ...

  5. adb移动端测试

    1. Android介绍 Android 是google公司主导的一个开放的手机操作系统,不过目前已经超过了手机的局限,而定位于移动设备的操作系统. Android一词的本义指“机器人”,取名原因很简 ...

  6. 008-js中的正则表达式

    查看地址:http://www.runoob.com/js/js-regexp.html 一.正则表达式概述 正则表达式(英语:Regular Expression,在代码中常简写为regex.reg ...

  7. 003-hive安装

    http://www.aboutyun.com/thread-6902-1-1.html http://www.aboutyun.com/thread-7374-1-1.html

  8. vue-自定义pc端键盘-动画

    <template> <div class="keyboard"> <div class="keyboard_key"> & ...

  9. Sublime Text 许可证

    ----- BEGIN LICENSE Alexander Single User License EA7E- 51F47F09 4EAB1285 7827EFF0 8B1207DC A76A6EA3 ...

  10. cmd项目目录结构以及配置文件的升级编写

    一.项目的目录结构: bin:执行文件夹 config:自定义配置文件 lib:公共的模块或者类文件 src:核心业务逻辑代码 二.配置文件的编写 1)config代码如下 from lib.conf ...