Been here for a bit, and have had all questions I've ever had answered...until now.
So, I'm making my first web app with Python/Flask, with much of it per instruction via the Udemy Python Mega Course, Build a Data Collector Web App.
The app itself is a Baby Weight Guessing app. Truth be told, I have my first kiddo due in just over two months, and I thought I would be cool to not just test my Python skills, but make an interactive app that family and friends can have fun with.
Basically, the user will access the site, provide their name, and their guess as to what my lil one's weight will be upon delivery some time in September.
Right now, the HTML and CSS are in place, and I'm getting the Python script in place. I'll get to the database and that stuff eventually, but right now, I have a hurdle I would like to pass first.
Actual Issue When a name and weight are input, and submit is clicked, the user is directed to a 'success' page that simply thanks them for their guess, and that the page will go back in a few seconds. Unfortunately, I can't figure out how to go back to index.html after a few seconds. This is what I need assistance with.
Here is the HTML for both the index.html and success.html:
Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../static/styles.css" />
<link
href="https://fonts.googleapis.com/css2?family=Comic+Neue:wght@300;400;700&display=swap"
rel="stylesheet"
/>
<title>Guess Kaden's Weight</title>
</head>
<body>
<div class="container">
<div class="contents">
<h1 class="heading" id="main_heading">Guess Kaden's Birth Weight</h1>
<h3 class="heading desc">
Kaden's arrival is right around the corner.
</h3>
<h3 class="heading desc">
Submit your guess to what his birth weight is.
</h3>
<h3 class="heading desc">Winner gets eternal bragging rights!</h3>
<h2 class="heading show_avg">Current average weight guessed is:</h2>
<!-- <div class="message">
{{text | safe}}
</div> -->
<form method="POST" action="{{url_for('success')}}">
<label for="guesser_name" class="labels"
>Please provide your name:</label
>
<input
class="input_box"
id="guesser_name"
type="text"
title="guesser_name"
name="guesser_name"
required
/>
<label for="guesser_guess" class="labels"
>Please provide your guess in pounds:</label
>
<input
class="input_box"
id="guesser_guess"
type="number"
step="0.1"
title="guesser_guess"
placeholder="Example - 6.7"
name="guesser_guess"
required
/>
<button type="submit" class="submit_button">Submit</button>
</form>
</div>
</div>
</body>
</html>
Success.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../static/styles.css" />
<link
href="https://fonts.googleapis.com/css2?family=Comic+Neue:wght@300;400;700&display=swap"
rel="stylesheet"
/>
<title>Guess Kaden's Weight</title>
</head>
<body>
<div class="success_container">
<div class="success_contents">
<h1>
Thank you for your guess!
</h1>
<h1>
You will now be redirected back to the main screen.
</h1>
</div>
</div>
</body>
</html>
And the app.py file:
from flask import Flask, render_template, request, redirect, url_for
app = Flask(__name__)
@app.route("/")
def index():
return render_template("index.html")
@app.route("/success", methods=['POST'])
def success():
return render_template("success.html")
if __name__ == "__main__":
app.debug = True
app.run()
I've tried a few things, but nothing seems to work. I'm confident if I knew more about how Flask works, this would be easy to figure out, but alas, I'm still new to it.
Any input would be truly appreciated.
