I am trying to create a dynamic form from a given list of labels using Flask, WTForms and Jinja2.
The form should contain a StringField
for every given label.
My current approach is to use a FieldList
like in the code below.
My problem with this approach is, that I can't distinguish between the keys in the dictionary of each request.
request.form
gives me this ImmutableMultiDict([('text', ''), ('text', ''), ('submit', 'submit')])
with key duplicates.
How can I find out which value was entered into which StringField
?
Ideally request.form
should look like this ImmutableMultiDict([('field 1', ''), ('field 2', ''), ('submit', 'submit')])
.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="" method="post">
{% for entry in form.entries %}
<p>{{entry.text.label}}: {{ entry.text }}</p>
{% endfor %}
<p>{{form.submit()}}</p>
</form>
</body>
</html>
from wtforms import FieldList, FormField, StringField, SubmitField
from flask_wtf import FlaskForm
class TextForm(FlaskForm):
text = StringField('Placeholder')
class TextListForm(FlaskForm):
entries = FieldList(FormField(TextForm))
submit = SubmitField(u'submit')
from flask import Flask, render_template, request
app = Flask(__name__)
app.config.update(
SECRET_KEY = 'asdf',
)
field_names = ["field 1", "field 2"]
@app.route('/', methods=['POST', 'GET'])
def index():
fields = []
for name in field_names:
text_entry = TextForm()
text_entry.text.label = name
fields.append(text_entry)
form = TextListForm()
form.entries = fields
if form.is_submitted():
print(request.form)
return render_template('index.html', form=form)
if __name__ == '__main__':
app.run(debug=True)
Output: ImmutableMultiDict([('text', ''), ('text', ''), ('submit', 'submit')])
I just forgot to set the field name: text_entry.text.name = name
@app.route('/', methods=['POST', 'GET'])
def index():
fields = []
for name in field_names:
text_entry = TextForm()
text_entry.text.label = name
text_entry.text.name = name
fields.append(text_entry)
form = TextListForm()
form.entries = fields
if form.is_submitted():
print(request.form)
return render_template('index.html', form=form)
Now the desired dict is returned: ImmutableMultiDict([('field 1', ''), ('field 2', ''), ('submit', 'submit')])