How to paginate images using flask

Viewed 19

I am trying to paginate these images using Flask. I want to know the best way to go about this.

on the routes.py file

@login_required
def search_images():
    pics = os.listdir('C:/Users/path/flask_site/static/images/search_images')
    number_of_pics = len(pics) # number of pics for search images box placeholder

    return render_template('search_images.html', pics=pics, number_of_pics=number_of_pics)

on the search_images.html file

    <h1 class="s-heading">Type to search images</h1>
    <input type="text" id="search-box" placeholder="Search {{ number_of_pics }} images:">
        <div id="paginated-list" aria-live="polite">
        <div class="s-image-container">


                {% for pic in pics %}
                <div class="s-image" data-title="{{ pic.replace('.jpg', '') }}">
                    <img id="lol" src="/static/images/search_images/{{ pic }}" alt="">
                    <h3>{{pic.replace('.jpg', '')}}</h3>
                </div>
                {% endfor %}
 
                 </div>
                 </div>
        </div>

this is what the site looks like but I do not want them to keep adding onto the page which is why I want to paginate them but coming into trouble doing so. Any suggestions?

0 Answers
Related