如何使用Flask/WTForms预填充复选框_如何使用Flask WTForms创建多选选项_如何基于URL参数预填充复选框 - 腾讯云开发者社区

如何使用Flask/WTForms预填充复选框

基础概念

Flask 是一个轻量级的 Web 框架，用于构建 Web 应用程序。WTForms 是一个 Flask 扩展，用于处理表单数据。复选框（Checkbox）是一种常见的表单元素，允许用户选择一个或多个选项。

类型

复选框有两种类型：

单个复选框：用于表示一个布尔值（是/否）。
多个复选框：用于表示一组选项中的一个或多个。

应用场景

复选框常用于以下场景：

用户同意条款和条件。
多选兴趣爱好。
选择多个选项进行提交。

如何使用 Flask/WTForms 预填充复选框

假设我们有一个表单，用户可以选择多个兴趣爱好。我们希望在表单加载时预填充一些默认的兴趣爱好。

1. 安装依赖

首先，确保你已经安装了 Flask 和 WTForms：

pip install Flask WTForms

2. 创建表单类

创建一个表单类，定义复选框字段：

from flask_wtf import FlaskForm
from wtforms import BooleanField, SubmitField

class HobbyForm(FlaskForm):
    hobby1 = BooleanField('Reading')
    hobby2 = BooleanField('Sports')
    hobby3 = BooleanField('Music')
    submit = SubmitField('Submit')

3. 创建视图函数

在视图函数中，创建表单实例并预填充复选框：

from flask import Flask, render_template, redirect, url_for

app = Flask(__name__)
app.config['SECRET_KEY'] = 'your_secret_key'

@app.route('/', methods=['GET', 'POST'])
def index():
    form = HobbyForm()
    # 预填充复选框
    form.hobby1.data = True
    form.hobby3.data = True
    
    if form.validate_on_submit():
        # 处理表单提交
        selected_hobbies = []
        if form.hobby1.data:
            selected_hobbies.append('Reading')
        if form.hobby2.data:
            selected_hobbies.append('Sports')
        if form.hobby3.data:
            selected_hobbies.append('Music')
        return f'Selected hobbies: {", ".join(selected_hobbies)}'
    
    return render_template('index.html', form=form)

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

4. 创建模板文件

创建一个 HTML 模板文件 index.html，渲染表单：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Pre-filled Checkboxes</title>
</head>
<body>
    <form method="POST">
        {{ form.hidden_tag() }}
        <p>{{ form.hobby1.label }} {{ form.hobby1() }}</p>
        <p>{{ form.hobby2.label }} {{ form.hobby2() }}</p>
        <p>{{ form.hobby3.label }} {{ form.hobby3() }}</p>
        <p>{{ form.submit() }}</p>
    </form>
</body>
</html>