python 复选框的文本信息怎么设置在左边 flask 复选框

转载

mob6454cc782a8c 2024-06-19 13:12:15

文章标签 flask python 表单字段 html 文章分类 Python 后端开发

表单：

表单是网站与用户交互必不可少的元素。表单中可以提供文本输入框、单选按钮、复选框、按钮等元素供用户提交数据。

表单还有验证数据的作用，这个是通过javascript进行验证的。那么服务器端要进行数据验证是通过第三方插件Flask-WTF。这个工具有主要有几个作用：验证数据和渲染表单HTML标签、CSRF保护和上传文件。

1、安装：

pip install flask-wtf

python 复选框的文本信息怎么设置在左边 flask 复选框_字段

2、register.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>注册</title>
</head>
<body>
    <form action="{{ url_for('register') }}" method="POST">
        <table>
            <tr>
                <td>用户名：</td>
                <td><input type="text" name="username"></td>
            </tr>
            <tr>
                <td>邮箱：</td>
                <td><input type="email" name="email"></td>
            </tr>
            <tr>
                <td>密码：</td>
                <td><input type="password" name="password"></td>
            </tr>
            <tr>
                <td>确认密码：</td>
                <td><input type="password" name="confirm_password"></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="submit" value="提交"></td>
            </tr>
        </table>
    </form>
</body>
</html>

得到的页面如下：

python 复选框的文本信息怎么设置在左边 flask 复选框_html_02

那我们对这个页面的字段提出一些需求：

1）用户名：至少输入2位以上，最大20个字符；

2）邮箱格式必须以@结尾；

3）密码至少输入6位以上字符；

4）确认密码：该字段内容必须和密码字段内容一致。

如果用户输入错误，在页面上要及时给出提示。

这个工作可以由前端Javascript来完成，但是服务器端也要做好验证。有技术功底的人员可以绕开J前端javascript的验证。服务器端的验证可以通过WTForms来实现。

3、在项目的根路径下创建forms.py文件：

from wtforms import Form, StringField
from wtforms.validators import length, email, equal_to


class RegisterForm(Form):
    username = StringField(Validators=[length(min=3, max=20, message="请输入正确长度的用户名")])
    email = StringField(Validators=[email(message="请输入正确格式的邮箱！")])
    password = StringField(Validator=[length(min=6, max=20, message="请输入正确长度的密码")])
    confirm_password = StringField(Validators=[equal_to("password", message="两次密码不一致")])

Field类的类型：

StringField

IntegerField

FloatField

DecimalField

BooleanField

DatetimeField

DateField

TimeField

FileField

每个字段都传递了Validators参数，这个参数是可以存储多个验证器的集合。

验证器的格式：

length(min, max, message) : 验证长度是否在区间内。

email (): 验证内容是否满足邮箱格式规则。

any_of(values, message, values_formatter): 验证是否是value中的一个。

4、视图函数中使用表单：

from wtforms import Form, StringField
from wtforms.validators import length, email, equal_to


class RegisterForm(Form):
    username = StringField(validators=[length(min=3, max=20, message="请输入正确长度的用户名")])
    email = StringField(validators=[email(message="请输入正确格式的邮箱！")])
    password = StringField(validators=[length(min=6, max=20, message="请输入正确长度的密码")])
    confirm_password = StringField(validators=[equal_to("password", message="两次密码不一致")])

5、视图函数中使用表单：

from flask import Flask, render_template, request, redirect, url_for, flash
from forms import RegisterForm
import config

app = Flask("__name__")
app.config.from_object(config)


@app.route("/register", methods=['GET', 'POST'])
def register():
    if request.method == 'GET':
        return render_template("register.html")
    else:
        # request.form是html模板提交上来的表单数据
        form = RegisterForm(request.form)
        if form.validate():
            email = form.email.data
            username = form.username.data
            password = form.password.data

            print("email: ", email)
            print("username: ", username)
            print("password: ", password)
            return "Register Successfully."
        else:
            for errors in form.errors.values():
                for error in errors:
                    flash(error)
            return redirect(url_for("register"))


if __name__ == "__main__":
    app.run(debug=True)

6、增加config.py: