Flask-WTF for form validation

Introduction

Flask-WTF helps you check if the information users type in forms is correct and safe. It makes handling forms easier and more secure.

When you want to make sure users enter valid email addresses in a signup form.

When you need to check that passwords meet certain rules before saving them.

When you want to protect your forms from bad data or attacks like CSRF.

When you want to show helpful error messages if users forget to fill required fields.

When you want to organize form code cleanly in your Flask app.

Syntax

Flask

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Email, Length

class MyForm(FlaskForm):
    email = StringField('Email', validators=[DataRequired(), Email()])
    password = PasswordField('Password', validators=[DataRequired(), Length(min=6)])
    submit = SubmitField('Submit')

FlaskForm is the base class for creating forms.

Validators check if the input meets rules like being filled or having a valid email format.

Examples

A simple form with one required text field called 'Name'.

Flask

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

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

This form checks if the input is a valid email address.

Flask

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

class EmailForm(FlaskForm):
    email = StringField('Email', validators=[Email()])

This form requires the password to be at least 8 characters long.

Flask

from flask_wtf import FlaskForm
from wtforms import PasswordField
from wtforms.validators import Length

class PasswordForm(FlaskForm):
    password = PasswordField('Password', validators=[Length(min=8)])

Sample Program

This Flask app shows a login form with email and password fields. It checks if the email is valid and the password is at least 6 characters. If the form is correct, it shows a success message.

Flask

from flask import Flask, render_template_string, request
from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField
from wtforms.validators import DataRequired, Email, Length

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

class LoginForm(FlaskForm):
    email = StringField('Email', validators=[DataRequired(), Email()])
    password = PasswordField('Password', validators=[DataRequired(), Length(min=6)])
    submit = SubmitField('Login')

form_html = '''
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Login</title>
</head>
<body>
  <h1>Login Form</h1>
  <form method="POST">
    {{ form.hidden_tag() }}
    <p>
      {{ form.email.label }}<br>
      {{ form.email(size=32) }}<br>
      {% for error in form.email.errors %}
        <span style="color: red;">{{ error }}</span><br>
      {% endfor %}
    </p>
    <p>
      {{ form.password.label }}<br>
      {{ form.password(size=32) }}<br>
      {% for error in form.password.errors %}
        <span style="color: red;">{{ error }}</span><br>
      {% endfor %}
    </p>
    <p>{{ form.submit() }}</p>
  </form>
  {% if success %}
    <p style="color: green;">Login successful for {{ email }}!</p>
  {% endif %}
</body>
</html>
'''

@app.route('/', methods=['GET', 'POST'])
def login():
    form = LoginForm()
    success = False
    email = ''
    if form.validate_on_submit():
        email = form.email.data
        success = True
    return render_template_string(form_html, form=form, success=success, email=email)

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

Important Notes

Always set a secret key in your Flask app to protect forms from CSRF attacks.

Use validate_on_submit() to check if the form was submitted and is valid in one step.

Flask-WTF automatically adds a hidden CSRF token field to your forms for security.

Summary

Flask-WTF makes form handling and validation simple and secure in Flask apps.

Use validators to check user input like required fields, email format, and length.

Show helpful error messages and protect forms from attacks easily.

Practice

1. What is the main purpose of using Flask-WTF in a Flask application?

easy

A. To simplify form creation and add validation easily

B. To create database models automatically

C. To handle user authentication and sessions

D. To serve static files like images and CSS

Solution

1. Step 1: Understand Flask-WTF role

   Flask-WTF is a Flask extension that helps create forms and validate user input easily and securely.

2. Step 2: Compare options with Flask-WTF purpose

   Options A, B, and D relate to other Flask features or extensions, not form validation.

3. Final Answer:

   To simplify form creation and add validation easily -> Option A

4. Quick Check:

   Flask-WTF = form handling and validation [OK]

Hint: Flask-WTF = forms + validation helper [OK]

Common Mistakes:

• Confusing Flask-WTF with database or auth tools
• Thinking Flask-WTF serves static files
• Assuming Flask-WTF manages sessions

2. Which of the following is the correct way to import the FlaskForm base class from Flask-WTF?

easy

A. from flask_wtf import FlaskForm

B. from flask import FlaskForm

C. import FlaskForm from flask_wtf

D. from flask_wtf.forms import FlaskForm

Solution

1. Step 1: Recall Flask-WTF import syntax

   The FlaskForm class is imported directly from the flask_wtf package using 'from flask_wtf import FlaskForm'.

2. Step 2: Check other options for syntax errors or wrong paths

   from flask import FlaskForm imports from flask (wrong package). import FlaskForm from flask_wtf uses invalid syntax. from flask_wtf.forms import FlaskForm imports from a non-existent submodule.

3. Final Answer:

   from flask_wtf import FlaskForm -> Option A

4. Quick Check:

   Correct import = from flask_wtf import FlaskForm [OK]

Hint: FlaskForm is from flask_wtf, not flask [OK]

Common Mistakes:

• Importing FlaskForm from flask instead of flask_wtf
• Using incorrect import syntax like 'import X from Y'
• Assuming FlaskForm is in a submodule

3. Given this Flask-WTF form class, what will form.validate_on_submit() return if the submitted email is empty?

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

class EmailForm(FlaskForm):
    email = StringField('Email', validators=[DataRequired(), Email()])

medium

A. Raises an exception due to missing email

B. True, because the form is submitted

C. True, because Email validator ignores empty fields

D. False, because the email field is empty and required

Solution

1. Step 1: Understand validators on email field

   The email field uses DataRequired() which means it must not be empty, and Email() to check format.

2. Step 2: Analyze validate_on_submit() behavior with empty email

   Since email is empty, DataRequired() fails, so validate_on_submit() returns False.

3. Final Answer:

   False, because the email field is empty and required -> Option D

4. Quick Check:

   Empty required field = validation fails [OK]

Hint: Empty required fields cause validation to fail [OK]

Common Mistakes:

• Assuming empty fields pass Email validator
• Thinking form submission means validation is True
• Expecting exceptions instead of False return

4. Identify the error in this Flask-WTF form definition:

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

class NameForm(FlaskForm):
    name = StringField('Name', validators=Length(min=3, max=25))

medium

A. FlaskForm must be imported from wtforms, not flask_wtf

B. StringField does not accept validators argument

C. validators should be a list, not a single Length instance

D. Length validator requires a message argument

Solution

1. Step 1: Check validators argument type

   Validators must be passed as a list or tuple, even if only one validator is used.

2. Step 2: Identify the error in code

   Here, validators=Length(...) passes a single instance, not a list, causing a TypeError.

3. Final Answer:

   validators should be a list, not a single Length instance -> Option C

4. Quick Check:

   Validators must be in a list [OK]

Hint: Always wrap validators in a list [] [OK]

Common Mistakes:

• Passing a single validator without list brackets
• Thinking validators argument is optional
• Importing FlaskForm from wrong package

5. You want to create a Flask-WTF form that requires a username between 4 and 12 characters and an optional email that must be valid if provided. Which validator setup is correct?

from flask_wtf import FlaskForm
from wtforms import StringField
from wtforms.validators import DataRequired, Length, Email, Optional

class UserForm(FlaskForm):
    username = StringField('Username', validators=[DataRequired(), Length(min=4, max=12)])
    email = StringField('Email', validators=[???])

hard

A. [DataRequired(), Email()]

B. [Optional(), Email()]

C. [Email(), Optional()]

D. [Length(min=4, max=12), Optional()]

Solution

1. Step 1: Understand optional email validation

   Email is optional, so Optional() must come before Email() to allow empty input without error.

2. Step 2: Check validator order and correctness

   [Optional(), Email()] correctly uses [Optional(), Email()] so empty email passes, and if present, Email() validates format.

3. Final Answer:

   [Optional(), Email()] -> Option B

4. Quick Check:

   Optional before Email for optional valid email [OK]

Hint: Put Optional() before Email() for optional email fields [OK]

Common Mistakes:

• Using DataRequired() on optional fields
• Reversing order of Optional() and Email()
• Using Length validator on email field