Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
940 views
in Technique[技术] by (71.8m points)

404 error when trying to display the sql table content in the HTML webpage using Python flask

I have created a simple BMI calculation application the code works for inserting records into a table but I can't able to display the records.

Here is my code. kindly, help me out to solve this issue. this code successfully inserted records to table.but failed to display to the webpage.

app.py

from flask import Flask,render_template,request,redirect,url_for,flash
from flask_mysqldb import MySQL
app=Flask(__name__)
app.secret_key="flash message"
app.config['MYSQL_HOST']='localhost'
app.config['MYSQL_USER']='root'
app.config['MYSQL_PASSWORD']='mypassword'
app.config['MYSQL_DB']='bmicalculate'
mysql=MySQL(app)
@app.route('/')
def index():
    return render_template('index.html')

@app.route('/display',methods=['POST'])
def display():
    cur=mysql.connection.cursor()
    cur.execute("select * from userdetails")
    data=cur.fetchall()
    cur.close()
    return render_template('display.html',data=data)


@app.route('/insert',methods=['POST'])
def insert():
    if request.method=="POST":
        name=request.form['name']
        age=request.form['age']
        weight=request.form['weight']
        height=request.form['height']
        weight=int(weight)
        height=int(height)
        bmi=((weight)/(height*height))*10000
        bmi=int(bmi)
        cur=mysql.connection.cursor()
        cur.execute("insert into userdetails(name,age,weight,height,bmi) values (%s,%s,%s,%s,%s)",(name,age,weight,height,bmi))
        mysql.connection.commit()
        return redirect(url_for('index'))

if __name__=="__main__":
    app.run(debug=True

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>BMI Application</title>
        <link rel='stylesheet' href="{{url_for('static',filename='style.css')}}">
    </head>
    <body>
        <div class='container'>
            <h1>BMI Calculation Web Development</h1>
        </div>
        <br><br>
        <div class="display">
            <a href="display.html" method="POST">
                <button>Display records</button>
            </a>
        </div>

        <div class="calculate">
            <h2>Enter your details</h2>
            <form action="{{url_for('insert')}}" method="POST">
                <div class="form">
                    <label>Name:</label>
                    <input type="text" class="form" name="name" placeholder="enter your name"  required="1"><br><br>
                </div>
                <div class="form">
                    <label>Age:</label>
                    <input type="text" class="form" name="age" placeholder="enter your age"  required="1"><br><br>
                </div>
                <div class="form">
                    <label>Weight:</label>
                    <input type="text" class="form" name="weight" placeholder="enter your weight in kgs"  required="1"><br><br>
                </div>
                <div class="form">
                    <label>Height:</label>
                    <input type="text" class="form" name="height" placeholder="enter your height in cm"  required="1"><br><br>
                </div>
                <div class="form">
                    <button class="btn" type="submit">Submit</button><br><br>
                </div>
            </form>
        </div>
    </body>
</html>

display.html

<!DOCTYPE html>
<html>
<head>
 <title>User Records</title>
</head>
<body>
<style>
 
 td {
        width: 150px;
        color:blueviolet;
        text-align: center;
        border: 1px solid black;
        padding: 5px;
      }
</style>
<table>
  <thead>
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Weight</th>
        <th>Height</th>
        <th>BMI</th>

    </tr>
    </thead>    
    <tbody>
     {% for row in data %}    
            <tr>
                <td>{{row[0]}}</td>
                <td>{{row[1]}}</td>
                <td>{{row[2]}}</td>
                <td>{{row[3]}}</td>
                <td>{{row[4]}}</td>
            </tr>
        {% endfor %}
    </tbody>
</table>
</body>
</html>

Please help me out to solve this issue.

question from:https://stackoverflow.com/questions/66067581/404-error-when-trying-to-display-the-sql-table-content-in-the-html-webpage-using

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Your display route only works for POST requests, but your browser sends a get request.

@app.route('/display',methods=['POST'])
def display():

Either change POST to GET or remove the methods=... completely, as GET is the default anyway.

If this sounds confusing, have a look at the following article which explains the HTTP verbs

https://developer.mozilla.org/de/docs/Web/HTTP/Methods

Update

You have to change your code to either

@app.route('/display',methods=['GET'])
def display():

or

@app.route('/display')
def display():

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...