我的理解是Flask-WTF与html文件的关系就如同SQLAlchemy与数据库之间的关系。

通过python Form类，生成html代码，并在html模板文件中通过{{}}变量的方式引用这些生成的html代码

好处就是可以使用python类管理html的表单，而不需要自己去敲html代码

下载依赖：

flask-wtf

flask的处理机制：

  • 定义WTForms表单类
  • 输出HTML代码
  • 在模板中渲染表单

实例：

basic.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<form method="post">

    {{form.csrf_token}}

    {{form.username.label}}{{form.username}}<br>

    {{form.password.label}}{{form.password}}<br>

    {{form.remember}}{{form.remember.label}}<br>

    {{form.submit}}<br>

</form>

</body>

</html>

forms.py

from flask_wtf import FlaskForm

from wtforms import StringField,PasswordField,BooleanField,SubmitField

from wtforms.validators import DataRequired,Length

class LoginForm(FlaskForm):

    username=StringField('Username',validators=[DataRequired()])

    password=PasswordField('Password',validators=[DataRequired(),Length(8,128)])

    remember=BooleanField('Remember me')

    submit = SubmitField('Log in')

app.py

from flask import  Flask,render_template

from demo1.form.forms import LoginForm

app = Flask(__name__)

app.secret_key='secret string'

@app.route('/basic')

def basic():

    form = LoginForm()

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

if __name__=='__main__':

    app.run(debug=True)

效果： 

 知识扩展：

在创建HTML表单时，我们经常会需要使用HTML<input>元素的其他属性来对字段进行设置。比如添加class属性设置对应的CSS类为字段添加样式；

添加placeholder属性设置占位文本。默认情况下，WTForms输出的字段HTML代码只会包含id和name属性，属性值均为表单类中对应的字段属性名称。

如果要添加额外的属性，通常有两种方法。

1.使用render_kw属性

username = StringField('Username', render_kw={'placeholder':'Your Username'})

这个字段被调用后输出的HTML代码如下所示：

<input type="text" id ="username" name="username" placeholder="Your Username">

2.在调用字段时传入

在调用字段属性时，通过添加括号使用关键字参数的形式也可以传入字段额外的HTML属性：

form.username(style='width:200px;',class_='bar')

输出的HTML代码如下所示：

u'<input class="bar" id="username" name="username" style=""width:200px;" type="text">

注意：

class是Python的保留关键字，在这里我们使用class_来代替class，渲染后的<input>会获得正确的class属性，在模板中调用时

则可以直接使用class

通过上面的方法也可以修改id和name的属性，但表单被提交后，WTForms需要通过name属性来获取对应的数据，所以不能

修改name属性值。

修改后的forms.py

    username=StringField('Username',render_kw={'placeholder':'Your Username'},validators=[DataRequired()])

修改后的basic.html

<!DOCTYPE html>

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>

<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<h1>BootStrap Style Form</h1>

<dov class="container" >

    <form method="post">

    {{form.csrf_token}}

    <div class="form-group">

        {{form.username.label}}

        {{form.username(class='form-control')}}

    </div>

    <div class="form-group">

        {{form.password.label}}

        {{form.password(class='form-control')}}

    </div>

     <div class="form-check">

        {{form.remember(class='form-check-input')}}

        {{form.remember.label}}

    </div>

    {{form.submit(class='btn bth-primary')}}

</form>

</dov>

</body>

</html>

效果： 

【flask】使用Flask-WTF处理表单的更多相关文章

  1. Flask开发系列之Web表单

    Flask开发系列之Web表单 简单示例 from flask import Flask, request, render_template app = Flask(__name__) @app.ro ...

  2. flask 在模板中渲染表单

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

  3. flask插件系列之Flask-WTF表单

    flask_wtf是flask框架的表单验证模块,可以很方便生成表单,也可以当做json数据交互的验证工具,支持热插拔. 安装 pip install Flask-WTF Flask-WTF其实是对w ...

  4. [Flask]通过render_form快捷渲染表单

    依赖: Bootstrap-Flask 实例化方式与flask_bootstrap相同. 关于render_form(): Bootstrap-Flask内置了两个用于渲染WTForms表单类的宏,r ...

  5. flask 单个页面多个表单（单视图处理、多视图处理）

    单个页面多个表单 除了在单个表单上实现多个提交按钮,有时还需要在单个页面上创建多个表单.比如,在程序的主页上同时添加登录和注册表单.当在同一个页面上添加多个表单时,我们需要解决的问题是在视图函数中判断 ...

  6. flask实战-个人博客-表单

    表单 下面我们来编写所有表单类,personalBlog中主要包含下面这些表单: 登录表单: 文章表单: 评论表单: 博客设置表单: 这里仅介绍登录表单.文章表单.分类表单和评论表单,其他的表单在实现 ...

  7. 【Flask】 WTForm表单编程

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

  8. flask表单，orm,csrf

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

  9. Flask10 登录模块、表单框架、表单渲染、表单验证、bookie、请求之前钩子、g对象、编写装饰器

    from flask import Flask from flask import request from flask import render_template from flask_wtf i ...

随机推荐

  1. springboot中使用servlet时返回结果乱码问题

    在总的配置文件:application.properties中做一个配置,把我的问题解决了. #编码格式 spring.http.encoding.force=true spring.http.enc ...

  2. html 不刷新切换当前页面内容

    一个小功能,做个笔记: 操作流程是:导航产品有三个下拉子菜单,点击食品跳转,同时跳转出来的子页面中,选中食品这个当前项. 切换  食品  厨具   家电  三个选项卡在刷新页面的时候仍然停留在当前选中 ...

  3. Python with open 使用技巧

    在使用Python处理文件的是,对于文件的处理,都会经过三个步骤:打开文件->操作文件->关闭文件.但在有些时候,我们会忘记把文件关闭,这就无法释放文件的打开句柄.这可能觉得有些麻烦,每次 ...

  4. SEO黑页以及门页框架和JS跳转实现方法

    在去年大家还在针对第三方博客狂轰乱炸,比如:webs.com.blogspot.com.weebly.com主要是因为本身博客平台的权重,再就是低廉的成本,主需要注册,没有域名和服务器的投入.排名也非 ...

  5. 【hdu 6067】Big Integer

    题意 给你一个 \((k-1)\times (n+1)\) 的 \(01\) 矩阵 \(g\),求满足下列条件的 \(k(k\le 10)\) 进制整数的数量: 1. 不超过 \(n\) 位且数的最高 ...

  6. Java8使用lambda遍历List、Set、map

    public static void main(String[] args){ Map<String,String> map= new HashMap<>(); map.for ...

  7. javasctipt之DOM知识点

    一:DOM节点 子节点:childNodes 父节点:parentNode offsetPrent 二:元素属性操作 方式一:xxx.style.xxx 方式二:xxx.style["xxx ...

  8. 使用Vue自定义组件时，报did you register the component correctly? For recursive components, make sure to provide the "name" option.（未注册组件）的原因之一

    错误信息: [Vue warn]: Unknown custom element: <list> - did you register the component correctly? F ...

  9. nginx在一个服务器上配置两个项目，并通过两个不同的域名访问

    Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器,由俄罗斯的程序设计师Igor Sysoev所开发,其特点是占有内存少,并发能力强. 话不多说,先从最基 ...

  10. 同余&逆元简单总结

    # 同余&逆元 1. 同余 1. 同余的基本概念及性质 若\(x\)%\(m=a\)即m是 x-a 的一个因子, 则称x与a关于m同余,记作:\[x \equiv a(mod \;m)\] 同 ...