在网站的主要布局模板中使用 Flask-wtforms 的困难

Posted 2023-03-05

【中文标题】在网站的主要布局模板中使用 Flask-wtforms 的困难

【英文标题】：Difficulties with having a Flask-wtforms in the main layout template of the website

【发布时间】：2021-11-17 14:20:31

【问题描述】：

我过去一直在使用烧瓶、python 和引导程序在网站上工作。我在我的网站上添加了页脚，我想在页脚中添加一个“联系我”表单。以下是我当前用于创建联系表单并显示此表单的代码。

class ContactForm(FlaskForm):
    email = StringField("", validators=[DataRequired(), Email()])
    content = TextAreaField("", validators=[DataRequired(), length(min=2, max=500)])

    submit = SubmitField("Submit")

<form method="POST" action="">
    <div class="form-group">
         form.email.label(class="form-control-label") 
        % if form.email.errors %
             form.email(class="form-control form-control-lg is-invalid") 
            <div class="invalid-feedback">
                % for error in form.email.errors %
                    <span> error </span>
                % endfor %
            </div>
        % else %
             form.email(class="form-control form-control-lg") 
        % endif %
    </div>
    <div class="form-group">
         form.content.label(class="form-control-label") 
        % if form.content.errors %
             form.content(class="form-control form-control-lg is-invalid") 
            <div class="invalid-feedback">
                % for error in form.content.errors %
                    <span> error </span>
                % endfor %
            </div>
        % else %
             form.content(class="form-control form-control-lg") 
        % endif %
    </div>
    <div class="form-group">
         form.submit(class="btn btn-outline-info") 
    </div>
</form>

我在“layout.html”文件中创建了此页脚，该文件是所有其他 html 文档扩展的基础文件，因此所有页面都将具有相同的页脚。

问题是，然后我需要在我的应用程序的每个页面上创建此表单对象的实例并处理每个页面上的 validate_on_submit。 （下面的示例代码）

@app.route("/random_page", methods=["GET", "POST"])
def random_page():
    form = ContactForm()

    if form.validate_on_submit():
        # code to send the email goes here

    return render_template("random_page")

我正在寻找一种更简单的方法来做到这一点，这样我就不需要在每个页面上重复代码，这样它就可以相当简单。我对烧瓶不是很有经验，非常感谢您的帮助。

【参考方案1】：

使用@app.context_processor 装饰器documentation 将您的联系表单实例注入到所有模板的模板上下文中。例如：

@app.context_processor
def inject():
    return dict(
        contact_form=ContactForm(),
    )

然后重新编写表单的 HTML 以使用 contact_form 模板变量，同时添加适当的操作路径。

<form method="POST" action="url_for('contact')">
    <div class="form-group">
         contact_form.email.label(class="form-control-label") 
        % if contact_form.email.errors %
             contact_form.email(class="form-control form-control-lg is-invalid") 
            <div class="invalid-feedback">
                % for error in form.email.errors %
                    <span> error </span>
                % endfor %
            </div>
        % else %
             contact_form.email(class="form-control form-control-lg") 
        % endif %
    </div>
    <div class="form-group">
         contact_form.content.label(class="form-control-label") 
        % if contact_form.content.errors %
             contact_form.content(class="form-control form-control-lg is-invalid") 
            <div class="invalid-feedback">
                % for error in contact_form.content.errors %
                    <span> error </span>
                % endfor %
            </div>
        % else %
             contact_form.content(class="form-control form-control-lg") 
        % endif %
    </div>
    <div class="form-group">
         contact_form.submit(class="btn btn-outline-info") 
    </div>
</form>  

然后添加一个路由来单独处理这个表单的回发：

@app.route("/contact", methods=["POST"])
def contact():
    form = ContactForm()

    if form.validate_on_submit():
        # code to send the email goes here

    # blah blah