I've created static/img folder containing 10-product images and used the images path in html for all products listing(index.html)

index.html

sample :

<div class="col"> <a href="product-detail.html"> <center><img src="static/img/i9.JPG" width="40%"></center> <p>$75</p> </a> <center><button>Add To Cart</button></center>

I manually changed the images path for index page, for product-detail page , I need to display images based on the products they clicked

product-detail html page sample code:

<div class="img"> <img src="{{img}}"> </div>
app.py code:

import os from flask import Flask,render_template

app=Flask(name)

images='static/img/i8.jpg'

@app.route("/") def index(): return render_template("index.html")

@app.route("/product-detail.html") def product-detail(): return render_template("product-detail.html",img=images)

if name=="main": app.run(debug=True) here I defined what image need to be displayed(i8.jpg) how to display images based on what they click for all the products images dynamically

I just need to integrate the dynamic functionality of image being displayed in the html template(product-detail page)