1. 创建表单
2.验证表单
<form action="/add" method="post">
...........
{{form.csrf_token}}
</form>
from flask import Flask,request,make_response,render_template,redirect
from flask_wtf import FlaskForm
from wtforms import *
from wtforms.validators import DataRequired
app = Flask(__name__)
app.secret_key=b'\x97\x91\xde\xc3dlP\xdf\xe49;\x9cn\xc5\xd2\xb0\x0e\xfd\x8f\xbd\x867b\xe6'
二、表单字段:
1.StringField 字符串
2.BooleanField 布尔值
3.FileField 文件
4.TextField 文本
5.SubmitField 提交
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>享学课堂2</title>
</head>
<body>
<h3>wtforms</h3>
<form action="/submit" method="post">
{{form.csrf_token}}
{{form.name.label}} {{ form.name(size=20)}}<br>
{{form.is_fav.label}} {{ form.is_fav() }}<br>
{{form.my_file.label}} {{form.my_file()}}<br>
{{form.info.label}} {{form.info()}}<br>
{{form.submit.label}} {{form.submit()}}<br>
{{form.pwd.label}} {{form.pwd()}}<br>
{{form.ta.label}} {{form.ta()}}<br>
{{form.roles.label}} {{form.roles()}}<br>
{{form.auths.label}} {{form.auths()}}<br>
<input type="submit" value="Go">
</form>
</body>
</html>
5.PasswordField 密码
6.TextAreaField 富文本框
7.SelectField 单选
8.SelectMultipleField 多选
from flask import Flask,request,make_response,render_template,redirect
from flask_wtf import FlaskForm
from wtforms import *
from wtforms.validators import DataRequired
app = Flask(__name__)
app.secret_key=b'\x97\x91\xde\xc3dlP\xdf\xe49;\x9cn\xc5\xd2\xb0\x0e\xfd\x8f\xbd\x867b\xe6'
class MyForm(FlaskForm):
name = StringField('name', validators=[DataRequired('这个字段必填')])
is_fav = BooleanField(label='推荐')
my_file= FileField(label='图片')
info = TextField(label='简介')
pwd = PasswordField(label='密码')
ta = TextAreaField(label='富文本框')
roles = SelectField(choices=[(1,'admin'),(2,'teacher'),(3,'student')])
auths = SelectMultipleField(choices=[(1,'admin'),(2,'teacher')])
submit = SubmitField(label='提交')
@app.route('/sucess')
def sucess():
return '提交成功'
@app.route('/submit',methods=('GET','POST'))
def submit():
form = MyForm()
if form.validate_on_submit():
return redirect('/sucess')
return render_template('submit2.html',form=form)
四、表单样式
使用bootstrap表单样式
1.render_kw
from flask import Flask,request,make_response,render_template,redirect
from flask_wtf import FlaskForm
from wtforms import *
from wtforms.validators import DataRequired
app = Flask(__name__)
app.secret_key=b'\x97\x91\xde\xc3dlP\xdf\xe49;\x9cn\xc5\xd2\xb0\x0e\xfd\x8f\xbd\x867b\xe6'
class MyForm(FlaskForm):
name = StringField('name', validators=[DataRequired('这个字段必填')],render_kw={'class':'form-contral'})
is_fav = BooleanField(label='推荐')
my_file= FileField(label='图片')
info = TextField(label='简介',render_kw={'class':'form-contral'})
pwd = PasswordField(label='密码',render_kw={'class':'form-contral'})
ta = TextAreaField(label='富文本框',render_kw={'class':'form-contral'})
roles = SelectField(choices=[(1,'admin'),(2,'teacher'),(3,'student')])
auths = SelectMultipleField(choices=[(1,'admin'),(2,'teacher')])
submit = SubmitField(label='提交',render_kw={'class':'btn btn-default'})
@app.route('/sucess')
def sucess():
return '提交成功'
@app.route('/submit',methods=('GET','POST'))
def submit():
form = MyForm()
if form.validate_on_submit():
return redirect('/sucess')
return render_template('submit2.html',form=form)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="{{url_for('static',filename='bootstrap/css/bootstrap.css')}}">
<title>享学课堂2</title>
</head>
<body>
<h3>wtforms</h3>
<div class="container">
<form action="/submit" method="post">
{{form.csrf_token}}
<div class="form-group form-contral">{{form.name.label}} {{ form.name(size=20)}}</div>
<div class="form-group">{{form.is_fav.label}} {{ form.is_fav() }}</div>
<div class="form-group">{{form.my_file.label}} {{form.my_file()}}</div>
<div class="form-group form-contral">{{form.info.label}} {{form.info()}}</div>
<div class="form-group form-contral">{{form.pwd.label}} {{form.pwd()}}</div>
<div class="form-group form-contral">{{form.ta.label}} {{form.ta()}}</div>
<div class="form-group">{{form.roles.label}} {{form.roles()}}</div>
<div class="form-group">{{form.auths.label}} {{form.auths()}}</div>
<!--<div class="form-group btn btn-default">{{form.submit.label}} {{form.submit()}}</div>-->
<div class="form-group btn btn-default">{{form.submit.label}} {{form.submit()}}</div>
</form>
</div>
<!--<form>-->
<!--<div class="form-group">-->
<!--<label for="exampleInputEmail1">Email address</label>-->
<!--<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">-->
<!--</div>-->
<!--<div class="form-group">-->
<!--<label for="exampleInputPassword1">Password</label>-->
<!--<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">-->
<!--</div>-->
<!--<div class="form-group">-->
<!--<label for="exampleInputFile">File input</label>-->
<!--<input type="file" id="exampleInputFile">-->
<!--<p class="help-block">Example block-level help text here.</p>-->
<!--</div>-->
<!--<div class="checkbox">-->
<!--<label>-->
<!--<input type="checkbox"> Check me out-->
<!--</label>-->
<!--</div>-->
<!--<button type="submit" class="btn btn-default">Submit</button>-->
<!--</form>-->
</body>
</html>