'Retrieving and Displaying Data from SQLAlchemy Database with Flask in HTML

I'm currently working on a school project where I wanted to built a simple website where you can enter a recipe that gets stored in a database and can then retrieve and display the recipe again. While I got the saving to the database to work, the retrieval is troubling me.

After entering the recipe, the user should be redirected to a page displaying the recipe that was just added.

So far I can display the last entry from the database, but I would like to be able to access and format the data in HTML, as now I only get a single line with all information.

Whenever I try to .pop the list of the results to get the entries as single variables (as they were saved to the database), I get an error that "Recipe is non iterable".

Has anyone any suggestions on how to proceed from here, as I'm stuck for a couple of hours now?

Python Code: I know ingredients is not spelled "ingredience" but I'm afraid to change it as it may break something lol.

class Recipe(db.Model):
    id = db.Column(db.Integer(), primary_key=True)
    rec_name = db.Column(db.String(length=200), nullable=False)
    ingredience = db.Column(db.String())
    recipe = db.Column(db.String())
    tags = db.Column(db.String(length=200))

    def __repr__(self):
        name = self.rec_name
        ing = self.ingredience
        rec = self.recipe
        tag = self.tags
        #return name, ing, rec, tag  (tried to return as variables but didn't work either)
        return f'Recipe Name: {self.rec_name}, Ingredients: {self.ingredience}, Recipe: {self.recipe}, Tags: {self.tags}'

#db.create_all()

@app.route('/') 
@app.route('/home')
def home_page():
    return render_template('home.html')


@app.route('/newrecipe', methods=['GET', 'POST'])
def new_recipe_page():
    if request.method == "POST":
        title_in = request.form['recipe_name']
        ing_in = request.form['ing']
        rec_in = request.form['recipe']
        tags_in = request.form['tags']
        new_rec = Recipe(rec_name=title_in, ingredience=ing_in, recipe=rec_in, tags=tags_in)
        db.session.add(new_rec)
        db.session.commit()
        db.session.close()
        return render_template('recipe.html')
    else:
        return render_template('fn_add_recipe_2.html')

@app.route('/recipe', methods=['POST', 'GET'])
def recipe():
    disp_recipe = []
    disp_recipe.append(Recipe.query.order_by(Recipe.id.desc()).first())
    # name = disp_recipe.pop()   --> (gives non-iterable error)
    return render_template('recipe.html', disp_recipe=disp_recipe)

Current HTML Code for the recipe displaying page:

<html lang="en">
  <head>
    <style>
      table.centre { 
        margin-left: auto;
        margin-right: auto;
      }
    </style>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="{{ url_for('static',filename='style.css') }}"> <!-- calls upon the css-stylesheet -->
    <title>Foodnote: add recipe</title>
    <div class="outer1">
      <a href="/home"><h1>FoodNote</h1></a></div>
  </head>


  <body>
    <form action="#" method="get">
      <h3>Your Recipe</h3>
      <p>
        {{ disp_recipe }}
      </p>

    </form>
  </body>

</html> 


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source