如何使用WTForms更优地动态添加输入字段，按数据类型灵活构建表单

这个需求完全可以实现，Flask-WTF支持动态向表单实例中添加字段，你只需要封装一个自定义表单基类即可。

第一步：编写自定义表单基类与业务代码 #

修改你的app.py文件如下：

from flask import Flask, render_template
from flask_wtf import FlaskForm
from wtforms import StringField, IntegerField

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

class MyForm(FlaskForm):
    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        # 计数器保证字段名唯一
        self.field_counter = 0

    def addStringField(self, default_value, label="字符串字段"):
        field_name = f"string_{self.field_counter}"
        # 动态添加字段到有序字段字典
        self._fields[field_name] = StringField(label, default=default_value)
        self.field_counter += 1

    def addIntegerField(self, default_value, label="整数字段"):
        field_name = f"integer_{self.field_counter}"
        self._fields[field_name] = IntegerField(label, default=default_value)
        self.field_counter += 1

@app.route('/', methods=['GET', 'POST'])
def index():
    form = MyForm()
    # 按你需要的顺序混合添加不同类型字段
    form.addIntegerField(1)
    form.addStringField("First String")
    form.addIntegerField(2)
    form.addStringField("Second String")
    return render_template('index.html', form=form) 

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

第二步：调整模板渲染逻辑 #

index.html不需要做复杂修改，保持循环渲染即可，字段会按照你添加的顺序输出：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <form method="POST" action="">
        {{ form.hidden_tag() }}
        <table>
            {% for field in form if field.widget.input_type != 'hidden' %}
            <tr>
                <td> {{ field.label }} </td>
                <td> {{ field }} </td>
            </tr>
            {% endfor %}
        </table>
        <button type="submit">提交</button>
    </form>
</body>
</html>

扩展功能说明 #

如果需要支持可切换的不同数据类型区块，只需要在添加字段时额外记录字段的类型标识，渲染时给对应字段的外层元素加上类型class，再配合简单的JS即可实现类型筛选切换效果。

内容的提问来源于stack exchange，提问作者Mike G