Flask_WTF实现表单可分为六个步骤:

①导入FlaskForm扩展包(from flask_wtf import FlaskForm)

②导入StringField,PasswordField,SubmitField (from wtforms import StringField,PasswordField,SubmitField)

③定义表单类


class RegisterForm(FlaskForm):
username = StringField('账号:')
password = PasswordField('密码:')
password2 = PasswordField('确认密码:')
submit=SubmitField('提交')

④定义路由

@app.route('/regist',methods=['GET','POST'])
def regist_form():
redist_form=RegisterForm()
return render_template('registform.html',form=redist_form)

⑤html文件中实现表单

<form method="post">
{{ form.username.label }}{{ form.username }}<br>
{{ form.password.label }}{{ form.password }}<br>
{{ form.password2.label }}{{ form.password2 }}<br>
{{ form.submit }}
</form>

完整代码:

app.py

from flask import Flask,render_template,request,flash
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField,SubmitField app = Flask(__name__)
app.secret_key='yingjie' # 定义表单类
class RegisterForm(FlaskForm):
username = StringField('账号:')
password = PasswordField('密码:')
password2 = PasswordField('确认密码:')
submit=SubmitField('提交') @app.route('/regist',methods=['GET','POST'])
def regist_form():
redist_form=RegisterForm()
return render_template('registform.html',form=redist_form) if __name__ == '__main__':
app.run()

registform.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="post">
{{ form.username.label }}{{ form.username }}<br>
{{ form.password.label }}{{ form.password }}<br>
{{ form.password2.label }}{{ form.password2 }}<br>
{{ form.submit }}
</form>
</body>
</html>

运行结果:

Flask_WTF实现表单的更多相关文章

  1. flask 在模板中渲染表单

    在模板中渲染表单 为了能够在模板中渲染表单,我们需要把表单类实例传入模板.首先在视图函数里实例化表单类LoginForm,然后再render_template()函数中使用关键脑子参数form将表单实 ...

  2. flask 利用flask_wtf扩展 创建web表单

    在Flask中,为了处理web表单,我们一般使用Flask-WTF扩展,它封装了WTForms,并且它有验证表单数据的功能 创建语句格式: startTime = DateTimeField('计划开 ...

  3. 第四章 Web表单

    4.1 跨站请求伪造保护 安装flask-wtf app = Flask(__name__) app.config['SECRET_KEY'] = 'hard to guess string' 密钥不 ...

  4. Flask-WTF 创建表单P2

    表单安全 无需任何配置,FlaskForm将提供具有CSRF(Cross-site request forgery,也被称为one-click attack 或者session riding,通常缩写 ...

  5. 【Flask】 结合wtforms的文件上传表单

    表单中的文件上传 基本的表单渲染,表单类设置等等就不多说了,参看另一个文章即可.但是那篇文章里没有提到对于FileField,也就是上传文件的表单字段是如何处理,后端又是如何实现接受上传过来的文件的. ...

  6. 【Flask】 WTForm表单编程

    WTForm表单编程 在网页中,为了和用户进行信息交互总是不得不出现一些表单.flask设计了WTForm表单库来使flask可以更加简便地管理操作表单数据.WTForm中最重要的几个概念如下: Fo ...

  7. Flask 扩展 表单

    pip install flask-wtf 一个简单的表单 from flask_wtf import Form from wtforms import StringField from wtform ...

  8. Flask学习 三 web表单

    web表单 pip install flask-wtf 实现csrf保护 app.config['SECRET_KEY']='hard to guess string' # 可以用来存储框架,扩展,程 ...

  9. flask form表单验证

    新建forms.py文件 #!/usr/bin/env python #-*-coding:utf--*- #导入模块 from flask_wtf import FlaskForm #FlaskFo ...

随机推荐

  1. PCB基础知识(一)

    在电子行业有一个关键的部件叫做PCB(printed circuit board,印刷电路板).这是一个太基础的部件,导致很多人都很难解释到底什么是PCB.这篇文章将会详细解释PCB的构成,以及在PC ...

  2. HTML5标签速查

    HTML5标签速查,助你快速了解HTML 5. HTML 5新加入的标签以黑体标识,HTML 5不支持的以斜体标识. 标签 描述 <!--...--> 评论 <!DOCTYPE> ...

  3. 现代CSS进化史

    英文:https://medium.com/actualize-...编译:缪斯 CSS一直被web开发者认为是最简单也是最难的一门奇葩语言.它的入门确实非常简单--你只需为元素定义好样式属性和值,看 ...

  4. css实现半圆效果

    效果图: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  5. java多线程的状态转换以及基本操作

    1. 新建线程 一个java程序从main()方法开始执行,然后按照既定的代码逻辑执行,看似没有其他线程参与,但实际上java程序天生就是一个多线程程序,包含了:(1)分发处理发送给给JVM信号的线程 ...

  6. Centos搭建 Docker 环境

    搭建 Docker 环境 安装与配置 Docker 安装 Docker Docker 软件包已经包括在默认的 CentOS-Extras 软件源里.因此想要安装 docker,只需要运行下面的 yum ...

  7. 项目-MyBlog

    项目 地址:https://gitee.com/zwtgit/my-blog 由Docker + SpringBoot2.0 + Mybatis + thymeleaf 等技术实现, 功能齐全.部署简 ...

  8. HCNP Routing&Switching之组播技术PIM-SM 稀疏模式

    前文我们了解了组播路由协议PIM以及PIM-DM密集模式相关话题,回顾请参考https://www.cnblogs.com/qiuhom-1874/p/16084310.html:今天我们来聊一聊PI ...

  9. Java第十五周作业

    Cola公司的雇员分为以下若干类:(知识点:多态) [必做题]• 4.1 ColaEmployee :这是所有员工总的父类,属性:员工的姓名,员工的生日月份.方法:getSalary(int mont ...

  10. Ubuntu 20.0.4 安装 NVIDIA N卡 驱动 画面撕裂 解决方法

    电脑 联想 Y7000 系统 Ubuntu 20.0.4 显卡 NVIDIA 1050TI 以下操作需要管理员权限 编辑文件,如果没有新建一个 /lib/modprobe.d/nvidia-graph ...