Flask学习记录之Flask-WTF

时间:2022-05-03 19:54:54

Flask-wtf时Wtforms库的flask框架扩展,能够方便的处理Web表单

一.定义一个web表单

使用flask-wtf时,每个web表单都由一个继承自flask.ext.wtf.Form的类表示,每个字段都由类中的属性表示,每个字段可以附属多个验证函数

from flask.ext.wtf import Form
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired,EqualTo class RegForm(Form):
username = StringField('Username',validators=[DataRequired()])
password = PasswordField('password', validators=[DataRequired()])
password1 = PasswordField('confirm password', validators=[DataRequired(),
EqualTo('password', 'password not match')
                                    ])
submit = SubmitField("submit")

这里定义了一个注册用户的表单,password1需要与password填写一样,字段的第一个属性是表单名,在validators中可以使用不同的验证器

二.使用表单

向模版中传入一个表单实例来渲染表单

@app.route('/reg', methods=('GET', 'POST'))
def reg():
form = RegForm()
#验证表单输入内容是否符合要求
if form.validate_on_submit():
#获取表单提交的内容
return "name:%r,password:%r"%(form.username.data,form.password.data)
return render_template('reg.html', form=form)

模版中

 <form action="" method="post" name="login">
{{form.hidden_tag()}}
<p>
Please enter your Name:<br>
{{form.name(size=80)}}<br>
</p>
<p>
Password:<br>
{{ form.password }}
</p>
<p>
Password:<br>
{{ form.password1 }}
</p>
<p>{{ form.submit }}</p>
</form>

form.hidden_tag() 模板参数将被替换为一个隐藏字段,用来是实现在配置中激活的 CSRF 保护。如果你已经激活了 CSRF,这个字段需要出现在你所有的表单中。

Flask-Bootst 提供了快捷的表单显示函数,如可直接使用:

{% extends 'base.html' %}
{% import 'bootstrap/wtf.html' as wtf%}
{% block page_content %} {{ wtf.quick_form(form) }} {% endblock %}

三.自定义表单验证

可以自定义表单的验证方式,比如如果数据库已经有了一个用户名就不能再注册同名的用户了,

....
from wtforms import ValidationError
....
class RegForm(Form):
....
#验证username字段时会自动调用这个函数
def validate_username(self,field):
if field.data == 'agmcs':
#抛出的异常提示可作为提示显示
raise ValidationError("the username is already exist")

四.Select控件的使用

class EditProfileAdminForm(Form):
role = SelectField('Role', coerce=int)
#在构造化Form实例时指定selectField的choices内容,
def __init__(self, *args, **kwargs):
super(EditProfileAdminForm, self).__init__( *args,
**kwargs)
self.role.choices = [(role.id, role.name) for role in Role.query.order_by(Role.name).all()]
#choices需要一个列表里面包含数个键值对应的元组 #也可以在初始化后使用form.role.choices = [(role.id, role.name) for role in Role.query.order_by(Role.name).all()] 来添加选项

没有使用Flask-bootstrap的话可以使用如下代码显示:

<div class="form-group" id='cg-{{form.role.id}}'>
{{form.role.label(class='col-lg-2 control-label',for=form.role.id)}}
<div class="col-lg-9">
{{form.role(class='form-control')}}
<span class="help-block" id='hl-{{form.role.id}}'></span>
</div>
</div

五.自定义表单的属性

刚才需要在flask-admin中替换TextArea为CKEDitor,这样就只能在代码中替换,可是ckeditor需要将textarea的class设置成ckedtor,上网查了一下,可以自己定义一个控件属性

明天写//