FLASK App not able to receive data from HTML form

Question

I have created the basic FLASK app to store student data and I am trying to receive the data from HTML form that is acting as frontend for the app.

But not able to receive the data from HTML form, can anyone please recommend the suggested approach or code.

MY FLASK APP CODE

import os.path
import random
import string

from flask import Flask, request, jsonify, render_template
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
basedir = os.path.abspath(os.path.dirname(__file__))
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + os.path.join(basedir, 'students.db')
db = SQLAlchemy(app)

class student(db.Model): #Table Declaration & Schema
    id = db.Column(db.Integer, primary_key=True)
    FirstName = db.Column(db.String(100), nullable=False)
    SecondName = db.Column(db.String(20), nullable=False)
    Section = db.Column(db.Text, nullable=False)


@app.route('/students', methods=['POST'])
def create_student():
    data = request.get_json()
    new_student = student(FirstName=data['FirstName'], SecondName=data['SecondName'], Section=data['Section']
    db.session.add(new_student)
    db.session.commit()
    return request.form


if __name__ == '__main__':
    with app.app_context():
        db.create_all()
    app.run(host='127.0.0.1',port=8000,debug=True)

My HTML FORM Code:

<!DOCTYPE html>
<html>
  <head>
    <title>Create Student Entry</title>
  </head>
 <form action="http://127.0.0.1:8000/students/" method="post">
  <label for="FirstName">FirstName:</label><br>
  <input type="text" id="FirstName" name="FirstName"><br>
  <label for="SecondName">SecondName:</label><br>
  <input type="text" id="SecondName" name="SecondName"><br>
  <label for="Section">Section:</label><br>
  <input type="text" id="Section" name="Section"><br>
  <input type="submit" value="Submit">
 </form>
</html>

The way you can access form data is with `request.form['name']` — jvx8ss, Jan 03 '23 at 12:18
Thanks for your help, already tried it but it will give CORS error mainly because of ```Content-Type': 'application/json``` — Ashish Bansal, Jan 03 '23 at 12:41
You might want to take a look at https://stackoverflow.com/questions/26980713/solve-cross-origin-resource-sharing-with-flask — jvx8ss, Jan 03 '23 at 12:53

score 1 · Answer 1 · answered Jan 03 '23 at 12:25

1

In the frontend code, try writing http://127.0.0.1:8000/students instead of http://127.0.0.1:8000/students/.

The "/" at the end is where the URL is getting wrong, and possibly the reason you're not receiving data.

answered Jan 03 '23 at 12:25

Satyajeet Sahu

48
6

Thanks, yes that was a typo but what worked was updating the value of ```data = request.form``` – Ashish Bansal Jan 03 '23 at 12:36

score 0 · Answer 2 · answered Jan 03 '23 at 12:39

Changed the value in FLASK code to data = request.form

Updated code for your reference.

import os.path
import random
import string

from flask import Flask, request, jsonify, render_template
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
basedir = os.path.abspath(os.path.dirname(__file__))
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + os.path.join(basedir, 'students.db')
db = SQLAlchemy(app)

class student(db.Model): #Table Declaration & Schema
    id = db.Column(db.Integer, primary_key=True)
    FirstName = db.Column(db.String(100), nullable=False)
    SecondName = db.Column(db.String(20), nullable=False)
    Section = db.Column(db.Text, nullable=False)


@app.route('/students', methods=['POST'])
def create_student():
    data = request.form
    new_student = student(FirstName=data['FirstName'], SecondName=data['SecondName'], Section=data['Section']
    db.session.add(new_student)
    db.session.commit()
    return "Student Record Updated", 201


if __name__ == '__main__':
    with app.app_context():
        db.create_all()
    app.run(host='127.0.0.1',port=8000,debug=True)

This isn't similar questions to what @davidism has marked as duplicate. Not sure, why the moderators here think that they are always right. — Ashish Bansal, Jan 03 '23 at 13:57

FLASK App not able to receive data from HTML form

2 Answers2