Form field types in Flask - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the rendered HTML output of this Flask-WTF form field?

Consider this Flask-WTF form field definition:

from flask_wtf import FlaskForm
from wtforms import StringField
from wtforms.validators import DataRequired

class MyForm(FlaskForm):
    name = StringField('Name', validators=[DataRequired()])

What HTML does the name field render by default?

A <input id="name" name="name" type="text" value="">

B <input id="name" name="name" type="password" value="">

C <textarea id="name" name="name"></textarea>

D <input id="name" name="name" type="email" value="">

💡 Hint

Think about the default HTML input type for a StringField in Flask-WTF.

A StringField renders as a standard text input field in HTML, which uses type="text". Other types like password or email are different field classes.

📝 Syntax

intermediate

Which option correctly defines a Flask-WTF IntegerField with a minimum value validator?

You want to create a form field that accepts only integers greater than or equal to 10. Which code snippet correctly defines this field?

A age = IntegerField('Age', validators=[NumberRange(min=10)])

B age = IntegerField('Age', validators=[DataRequired(min=10)])

C age = IntegerField('Age', validators=[Length(min=10)])

D age = IntegerField('Age', validators=[InputRequired(min=10)])

💡 Hint

Look for the validator that checks numeric ranges.

NumberRange validator is used to enforce minimum and maximum numeric values. DataRequired, Length, and InputRequired do not accept a min parameter for numeric range.

❓ state_output

advanced

What is the value of the form field after submission with empty input?

Given this Flask-WTF form:

from flask_wtf import FlaskForm
from wtforms import StringField
from wtforms.validators import DataRequired

class LoginForm(FlaskForm):
    username = StringField('Username', validators=[DataRequired()])

If the user submits the form with the username field left empty, what will be the value of form.username.data after form.validate_on_submit() is called?

A Raises a ValidationError

B None

C An empty string ('')

D The string 'None'

💡 Hint

Think about how WTForms handles empty text input fields.

WTForms sets the data attribute to an empty string if the input is empty. Validation fails but the data is still an empty string, not None or an exception.

🔧 Debug

advanced

Why does this Flask-WTF form field raise a TypeError?

Examine this form field definition:

from wtforms import SelectField

class MyForm(FlaskForm):
    choice = SelectField('Choose', choices='yes,no,maybe')

When rendering or validating, a TypeError occurs. Why?

A SelectField requires a default value, missing here.

B The <code>choices</code> argument must be a list of tuples, not a string.

C The field name 'choice' is a reserved keyword causing the error.

D SelectField cannot be used without a validator.

💡 Hint

Check the expected type for the choices parameter.

choices must be a list (or iterable) of tuples like [('yes', 'Yes'), ('no', 'No')]. Passing a string causes iteration over characters, leading to a TypeError.

🧠 Conceptual

expert

Which Flask-WTF field type should you use for a form input that accepts multiple file uploads?

You want users to upload several files at once in your Flask form. Which field type is best suited for this?

A TextAreaField with file URLs

B FileField with <code>multiple=True</code> attribute

C StringField with comma-separated file paths

D MultipleFileField

💡 Hint

Look for a field type designed specifically for multiple files.

MultipleFileField is designed to handle multiple file uploads in Flask-WTF. FileField handles single files only. Other options are not suitable for file uploads.