Flask 动态选择 WTForms Flask SelectField

在本文中，我们将介绍如何使用 Flask 和 WTForms 中的 SelectField 来实现动态选择功能。Flask 是一个轻量级的 Python Web 框架，而 WTForms 是一个用于处理表单数据的工具。通过使用 Flask 和 WTForms，我们可以轻松地实现动态选择表单字段，并根据用户的选择提供不同的选项。

阅读更多：Flask 教程

Flask 和 WTForms 简介

首先，让我们简要介绍一下 Flask 和 WTForms。Flask 是一个使用 Python 编写的 web 框架，它提供了简单而灵活的方式来构建 web 应用程序。它具有模块化、可扩展和易于使用的特点，因此广受开发者的喜爱。而 WTForms 是一个用于处理 web 表单数据的工具，它提供了一种简单而强大的方式来定义和验证表单。

使用 SelectField 实现动态选择

在 Flask 中，我们可以使用 WTForms 的 SelectField 类来创建一个选择字段。它允许我们定义一个静态的选择列表，即在表单类中直接指定选项。例如，我们可以创建一个选择国家的表单字段：

from flask_wtf import FlaskForm
from wtforms import SelectField

class CountryForm(FlaskForm):
    country = SelectField('Country', choices=[('us', 'United States'), ('cn', 'China'), ('jp', 'Japan')])

在上面的例子中，我们定义了一个名为 country 的 SelectField，并指定了三个选项：United States、China 和 Japan。当渲染表单时，这些选项将显示在下拉列表中供用户选择。

动态选择列表

然而，有时候我们需要根据用户的选择动态生成选项列表。这就需要使用到 Flask 和 WTForms 提供的动态功能。下面我们通过一个例子来演示如何实现动态选择列表。

假设我们正在开发一个网站，用户可以选择所居住的国家/地区，并根据选择提供相应的城市列表。我们首先创建一个表单类 LocationForm，其中包含两个字段：country 和 city。country 字段包含所有可选的国家/地区，而 city 字段则根据 country 的选择动态生成。

首先，我们需要定义一个函数 get_cities_by_country，它接受一个国家/地区代码，并返回对应的城市列表。例如：

def get_cities_by_country(country):
    city_dict = {
        'us': ['New York', 'Los Angeles', 'Chicago'],
        'cn': ['Beijing', 'Shanghai', 'Guangzhou'],
        'jp': ['Tokyo', 'Osaka', 'Kyoto']
    }
    return city_dict.get(country, [])

接下来，在表单类中定义 city 字段，并使用 get_cities_by_country 函数来动态生成选项列表。我们可以通过 WTForms 的 SelectField 类的 choices 参数来实现：

class LocationForm(FlaskForm):
    country = SelectField('Country', choices=[('us', 'United States'), ('cn', 'China'), ('jp', 'Japan')])
    city = SelectField('City')

    def set_city_choices(self, country):
        self.city.choices = [(city, city) for city in get_cities_by_country(country)]

在上述例子中，我们创建了一个名为 set_city_choices 的方法，它接受一个国家/地区代码，并根据该代码调用 get_cities_by_country 方法来动态设置 city 字段的选项列表。

最后，我们在视图函数中处理表单的提交，并在模板中渲染表单：

@app.route('/', methods=['GET', 'POST'])
def index():
    form = LocationForm()

    if form.validate_on_submit():
        country = form.country.data
        form.set_city_choices(country)

    return render_template('index.html', form=form)

在模板文件 index.html 中，我们可以使用 Flask 提供的模板语法渲染表单字段：

<form method="POST" action="/">
    {{ form.csrf_token }}
    {{ form.country.label }} {{ form.country }}
    {{ form.city.label }} {{ form.city }}
    <input type="submit" value="Submit">
</form>

现在，当用户选择一个国家/地区后，表单的城市列表将会根据选择动态更新。