0

I've just started learning django and have a problem loading images using loops.

  • In models.py I created a class called Pictures
  • In views.py I created 3 instance of the class(Pictures) where img attribute is set to 3 different image names stored in the static folder.

Now, I got stuck in loading the images in the template using for loop. apart from img attribute, I also created other attributes. These are the name and image description both of type string and they load just fine when rendered in the template using for loop.

My question is what should I put in inside the img html tag to load these 3 different images using for loop?

Initially, I was using the syntax below to load images directly from the static folder.

<img src="{% static 'img/image-name.jpg' %}" alt="" width="250" height="250">

Now, I want to load the names from the img attribute and for each iteration, I want each of the three different images to load in the template each loop. Now I am not sure what to put inside the src="???".

what i have so far and its working:

{% for image in images %}
<li>
<img src="{{image.img}}" alt="" width="250" height="250">
<!-- I am not sure which line of code to include in src="" -->
</li>
{% endfor %}

also tried creating a variable like this:

{% static "img" as baseUrl %}
<img src="{{baseUrl}}/{{image.img}}"
Ivan Starostin
  • 8,798
  • 5
  • 21
  • 39
Vernon
  • 1
  • Please instead of verbose description of your model just post the model definition itself - it will be more useful. It is not clear whether your files are **static** or **media** so please show everything related to configuration of both: related settings.py part, urls.py, project folder structure. Also show the view code. – Ivan Starostin Dec 26 '22 at 09:54
  • @IvanStarostin I have done all the configurations in settings.py. Everything is working. The problem is to load the images in the template using for loop. – Vernon Dec 26 '22 at 10:02
  • @Vernon Do you want to load uploaded images from media folder? – Manoj Tolagekar Dec 26 '22 at 10:08
  • https://stackoverflow.com/questions/66833381/static-media-images-are-not-displaying-in-django/66834540#66834540 – Ivan Starostin Dec 26 '22 at 10:15
  • @ManojTolagekar The images are stored in the static folder. I have an attribute of type str where I stored the name of these images. Now I want to load these names (string) into the template. Specifically in the img tag. (. Initially, I ve been loading these images as follows: – Vernon Dec 26 '22 at 10:17
  • @Vernon You cannot load all static images using loop – Manoj Tolagekar Dec 26 '22 at 10:22
  • loop is used for uploaded images which is stored in media – Manoj Tolagekar Dec 26 '22 at 10:25
  • @ManojTolagekar please kindly watch the part of the video. That is the course I am following.. https://youtu.be/OTmQOjsl0eg?t=5771 Please provide some feedback – Vernon Dec 26 '22 at 10:25

1 Answers1

0

put .url at image src

{% for image in images %}
<li>
<img src="{{image.img.url}}" alt="" width="250" height="250">
<!-- I am not sure which line of code to include in src="" -->
</li>
{% endfor %}
Mahammadhusain kadiwala
  • 2,693
  • 2
  • 4
  • 12