CODEWITHSUNDEEP
django
Rookie_123
Rookie_123

Reputation: 2017

Retrieve all static images in django

In my django app I have a javascript modal.In that modal I want to display all the available static images.I know if there is a single image we can display it as 

{% load static %}
      <img src="{% get_static_prefix %}images/abc.png">

But I want to display all the images(they are not fixed) dynamically.How can I write a loop for that.

My desired output (the loop should generate this output)

{% load static %}
      <img src="{% get_static_prefix %}images/abc.png">
      <img src="{% get_static_prefix %}images/def.png">
      <img src="{% get_static_prefix %}images/ghi.png">
      .
      .
      .
      <img src="{% get_static_prefix %}images/xyz.png">

Update 1 My views.py

def show_images(request):

    image_list=[]
    image_folder = settings.STATICFILES_DIRS  #you can add the subdirectory here as well with os.path.join
    for file in image_folder:
        if file.endswith(".png"):
            image_list.append(file)
    # TODO: Read list of existing Int Files and send data to feed the table
    return render(request, myapp/showimages.html', {'brands': image_list})

My template:

{% for file in brands %}
        <img src="{{file}}" alt="">
    {% endfor %}

But with this I am not able to load image at all

Upvotes: 2

Views: 1491

Answers (3)

GenaK
GenaK

Reputation: 1

In uploadApp application I have: view.py, displayImg.html.

view.py

def uploadImg(request):
    image_list=[]
    for root, dirs, files in os.walk(settings.MEDIA_ROOT):
        for file in files:
            image_## Heading ##list.append(file)
    return render(request, 'displayImg.html',{'brands': image_list})
#complete.html

displayImg.html

{% load static %}
{% block content %}    
    {% for file in brands %}
        <img src="{% get_media_prefix %}{{ file }}" width="500px" />
    {% endfor %} 
    {% endblock %}

In settings.py: 

MEDIA_ROOT = os.path.join(BASE_DIR, 'your path to upload images')

Upvotes: 0

GenaK
GenaK

Reputation: 1

view.py

def uploadImg(request):
    
    image_list=[]

    for root, dirs, files in os.walk(settings.MEDIA_ROOT):
        for file in files:
            image_list.append(file)
    return render(request, 'displayImg.html',{'brands': image_list})

displayImg.html

{% load static %}
{% block content %}    
    {% for file in brands %}
        <img src="{% get_media_prefix %}{{ file }}" width="500px" />
    {% endfor %} 
    {% endblock %}

In sittings.py: MEDIA_ROOT = os.path.join(BASE_DIR, 'your path to upload images')

Upvotes: 0

Osiris92
Osiris92

Reputation: 191

You can send all the static images in your context from the view.

image_list=[]
static_dirs = settings.STATICFILES_DIRS
for dir in static_dirs:
    for file in os.listdir(dir):
        if file.endswith(".png"):
            image_list.append(file)

If you want to traverse the whole static directory, you can do:

import os
image_list=[]
for root, dirs, files in os.walk(settings.STATIC_ROOT):
    for file in files:
        if file.endswith(".png"):
            image_list.append(file)

You can then return image_list in the context and iterate over it in the template.

Update: For all static files in a particular app, you can do:

import os
image_list=[]
app_static_dir = os.path.join(os.path.join(os.path.join(os.path.join(settings.BASE_DIR,'appname'),'static'),'images'),'brands')  #appname is your appname and brands is the folder that you mentioned
for file in os.listdir(app_static_dir):
    if file.endswith(".png"):
        image_list.append(file)

Upvotes: 3

Related Questions