Accessing form data in Flask - Mini Project: Build & Apply

Accessing form data in Flask

📖 Scenario: You are building a simple web app using Flask. The app has a form where users enter their name and email. You want to capture this data when the form is submitted.

🎯 Goal: Create a Flask app that shows a form with name and email fields. When the user submits the form, the app should access the form data and store it in variables.

📋 What You'll Learn

Create a Flask app with a route for the form

Add an HTML form with name and email input fields

Use a config variable to set the form submission method

Access the form data using Flask's request.form

Store the submitted name and email in variables

💡 Why This Matters

🌍 Real World

Web apps often need to collect user input through forms, such as sign-up pages or contact forms. Accessing form data is essential to process user input.

💼 Career

Understanding how to handle form data in Flask is a key skill for backend web developers working with Python frameworks.

1

Create the Flask app and form route

Write code to import Flask and request from flask. Create a Flask app called app. Define a route /form that returns a simple HTML form with name and email input fields and a submit button.

Flask

# Your code here to create Flask app and /form route with HTML form

Need a hint?

Remember to import Flask and request. Use @app.route('/form') to create the route. Return a string with the HTML form inside the route function.

2

Set the form submission method

Add a variable called method and set it to the string 'POST'. Then update the HTML form's method attribute to use this variable inside the form route.

Flask

from flask import Flask, request

app = Flask(__name__)

@app.route('/form')
def form():
    method = 'POST'
    # Use the method variable in the form tag below
    return '''
    
      Name:
      
      Email:
      
      Submit
    
    '''

Need a hint?

Create a variable method with value 'POST'. Use an f-string to insert it inside the form's method attribute.

3

Access form data in POST request

Modify the /form route to accept both GET and POST methods. Inside the route, check if the request method is POST. If yes, access the form data using request.form and store the values of name and email in variables called user_name and user_email.

Flask

from flask import Flask, request

app = Flask(__name__)

@app.route('/form', methods=['GET', 'POST'])
def form():
    method = 'POST'
    if request.method == 'POST':
        # Access form data here
        user_name = request.form['name']
        user_email = request.form['email']
    return f'''
    
      Name:
      
      Email:
      
      Submit
    
    '''

Need a hint?

Add methods=['GET', 'POST'] to the route decorator. Use if request.method == 'POST': to check the method. Access form data with request.form['name'] and request.form['email'].

4

Complete the route to show submitted data

Update the /form route to return a message showing the submitted user_name and user_email if the request method is POST. Otherwise, return the HTML form. Use an f-string to include the variables in the returned string.

Flask

from flask import Flask, request

app = Flask(__name__)

@app.route('/form', methods=['GET', 'POST'])
def form():
    method = 'POST'
    if request.method == 'POST':
        user_name = request.form['name']
        user_email = request.form['email']
        # Return a message showing the submitted data
        return f"Received name: {user_name}, email: {user_email}"
    # Return the form for GET requests
    return f'''
    
      Name:
      
      Email:
      
      Submit
    
    '''

Need a hint?

Inside the POST check, return a string with the submitted name and email using an f-string. For GET requests, return the form HTML.