第四章 Web表单
4.1 跨站请求伪造保护
安装flask-wtf
app = Flask(__name__)
app.config['SECRET_KEY'] = 'hard to guess string'
密钥不应写在代码中,具体信息会在第7章介绍。
4.2 表单类
// 定义表单类
from flask_wtf import Form
from wtforms import StringField, SubmitField
from wtforms.validators import Required class NameForm(Form):
name = StringField('What is your name?', validators=[Required()])
submit = SubmitField('Submit')
4.3 把表单渲染成HTML
<form method="POST">
{{ form.hidden_tag() }}
{{ form.name.label }} {{ form.name(id='my-text-field') }}
{{ form.submit() }}
</form>
使用flask-bootstrap渲染
{% import "bootstrap/wtf.html" as wtf %}
{{ wtf.quick_form(form) }}
index.html
{% 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) }}
{% endblock %}
4.4 在视图函数中处理表单
@app.route('/', methods=['GET', 'POST'])
def index():
name = None
form = NameForm()
if form.validate_on_submit():
name = form.name.data
form.name.data = ''
return render_template('index.html', form=form, name=name)
validate_on_submit() 传入的值通过验证则返回True
4.5 重定向和用户会话
@app.route('/', methods=['GET', 'POST'])
def index():
form = NameForm()
if form.validate_on_submit():
session['name'] = form.name.data
return redirect(url_for('index'))
return render_template('index.html', form=form, name=session.get('name'))
4.6 Flash消息
@app.route('/', methods=['GET', 'POST'])
def index():
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('Looks like you have changed your name!')
session['name'] = form.name.data
return redirect(url_for('index'))
return render_template('index.html', form=form, name=session.get('name'))
{% block content %}
<div class="container">
{% for message in get_flashed_messages() %}
<div class="alert alert-warning">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ message }}
</div>
{% endfor %} {% block page_content %}{% endblock %}
</div>
{% endblock %}
第四章 Web表单的更多相关文章
- ↗☻【HTML5秘籍 #BOOK#】第4章 Web表单
from元素用于组织所有表单部件,负责告诉浏览器把数据提交到哪里,方法是在action属性中提供一个URL.假如你只想在客户端使用JavaScript操作表单,那么只要在action属性中指定一个#即 ...
- 第三章:Web表单
感谢作者 –> 原文链接 本文翻译自 The Flask Mega-Tutorial Part III: Web Forms 这是Flask Mega-Tutorial系列的第三部分,我将告诉你 ...
- Flask 教程 第三章:Web表单
本文翻译自 The Flask Mega-Tutorial Part III: Web Forms 这是Flask Mega-Tutorial系列的第三部分,我将告诉你如何使用Web表单. 在第二章中 ...
- 基于Extjs的web表单设计器 第七节——取数公式设计之取数公式的使用
基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...
- 基于Extjs的web表单设计器 第六节——界面框架设计
基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...
- 基于Extjs的web表单设计器 第五节——数据库设计
这里列出表单设计器系列的内容,6.7.8节的内容应该在春节后才有时间出了.因为这周末就请假回老家了,准备我的结婚大事.在此提前祝大家春节快乐! 基于Extjs的web表单设计器 基于Extjs的web ...
- 读书笔记:《HTML5开发手册》Web表单
这是补充HTML5基础知识的第五篇内容,其他为: 一.HTML5-- 新的结构元素 二.HTML5-- figure.time.details.mark 三.HTML5-- details活学活用 四 ...
- Flask教程 —— Web表单(上)
第二章中介绍的request对象公开了所有客户端发送的请求信息.特别是request.form可以访问POST请求提交的表单数据. 尽管Flask的request对象提供的支持足以处理web表单,但依 ...
- 2017.2.28 activiti实战--第六章--任务表单(一)动态表单
学习资料:<Activiti实战> 第六章 任务表单(一)动态表单 内容概览:本章要完成一个OA(协同办公系统)的请假流程的设计,从实用的角度,讲解如何将activiti与业务紧密相连. ...
随机推荐
- dtrace4linux_Example
http://www.slideshare.net/brendangregg/what-linux-can-learn-from-solaris-performance-and-viceversa/8 ...
- 解决MVC Jquery"此请求已被阻止,因为当用在 GET 请求中时,会将敏感信息透漏给第三方网站"的问题
在ASP.NET MVC项目中,使用AJAX向控制器发送GET请求获取JSON数据时,出现这个错误:"此请求已被阻止,因为当用在 GET 请求中时,会将敏感信息透漏给第三方网站.若要允许 G ...
- 如何安装SQL Server 2008数据库(带完整图解)
在电脑上安装SQL Server 2008 软件时,经常会遇到各种各样的问题,如何成功的安装SQL Server 2008呢?提供完整过程和图片详解. 工具/原料 电脑一台 软件:sql server ...
- MVC - 学习总目录
MVC - 基础 MVC - HtmlHelper类 MVC - 路由 MVC - 身份验证 MVC - 模型验证 MVC - Ajax MVC - 布局
- Jenkins 安装与配置
1. 软件准备 a. 下载 jenkins.war:https://wiki.jenkins-ci.org/display/JENKINS/Meet+Jenkins. 本文以 Jenkins 为演示版 ...
- 使用apache common-io 监控文件变化--转
package common.io; import org.apache.commons.io.filefilter.FileFilterUtils; import org.apache.common ...
- focus on these tools
http://www.oschina.net/p/dubbo http://www.blogjava.net/hispark/archive/2008/12/01/243310.html http:/ ...
- ubuntu 安装 JVM 与 ElasticSearch
测试环境: Ubuntu x86_64 3.13.0-35-generic 安装jre: $ sudo apt-get install software-properties-common $ sud ...
- 对setTimeout()第一个参数是字串的深入理解以及eval函数的理解
<script language="javascript" type="text/javascript"> var a=1; setTimeout( ...
- 命令行创建Android应用,生成签名,对APK包签名并编译运行
一.命令行创建Android应用 android create project -n HelloWorld -t android-22 -p HelloWorld1 -k org.crazyit.he ...