Skip to content

二、渲染表单模板

1、flask代码

python
from flask import Flask,render_template,redirect
from flask_wtf import FlaskForm
from wtforms import StringField,BooleanField,SubmitField
from  wtforms.validators import Email,Length

class LoginForm(FlaskForm):
    email=StringField(label="邮箱:",validators=[Email(message="请输入正确的邮箱格式!")],render_kw={
        "placegholder":"请输入邮箱"
    })
    password=StringField(label="密码:",validators=[Length(min=6,max=20,message="请输入正确长度的密码!")],render_kw={
        "placeholder":"请输入密码"
    })
    remember=BooleanField(label="记住我:")
    submit=SubmitField(label="提交")


@app.route("/login",methods=["GET","POST"])
def login():
    form=LoginForm(meta={
        "csrf":False
    })
    if form.validate_on_submit():
        email=form.email.data
        password=form.password.data
        return redirect("/")

    return render_template("渲染表单模版.html",form=form)

2、前端代码

python
<form action="{{ url_for("login") }}" method="post">
    <table>
        <tbody>
        <tr>
            <td>{{ form.email.label }}</td>
            <td>{{ form.email }}</td>
        </tr>
        {% for error in form.email.errors %}
            <tr>
                <td></td>
                <td>{{ error }}</td>
            </tr>
        {% endfor %}

        <tr>
            <td>{{ form.password.label }}</td>
            <td>{{ form.password }}</td>
        </tr>
        {% for error in form.password.errors %}
            <tr>
                <td></td>
                <td>{{ error }}</td>
            </tr>
        {% endfor %}
        <tr>
            <td>{{ form.remember.label }}</td>
            <td>{{ form.remember }}</td>
        </tr>
        <tr>
            <td></td>
            <td>{{ form.submit }}</td>
        </tr>
        </tbody>
    </table>

</form>

3、结果

图片