How to get value in template from model through another one? - django

Question

I have two models connected by one-to-many relation. How can I get value from one field of one model through another? I need to get value "low" from Image model from the Album model. In my Image model "low" is a path to a low-res copy of image and "path_to_image" is the path to full-size one.
I use Django 2.1, build-in sqlite db.
models.py:
from django.db import models
from django.utils.timezone import now
class Album(models.Model):
title = models.CharField(max_length=120)
def __str__(self):
return self.title
class Image(models.Model):
path_to_image = models.CharField(max_length=120)
low = models.CharField(max_length=120)
pub_date = models.DateField(default=now)
album = models.ForeignKey(Album, on_delete=models.CASCADE)
def __str__(self):
return self.path_to_image
views.py:
def albums(request):
albums_list = Album.objects.all()
paginator = Paginator(albums_list, 20)
page = request.GET.get('page')
albums = paginator.get_page(page)
random_idx = random.randint(0, Image.objects.count() - 1)
image = Image.objects.all()[random_idx]
context = {
'albums': albums,
'image': image,
}
return render(request, 'gallery/albums.html', context)
albums.html:
<div class="item2 my-gallery responsive" itemscope itemtype="http://schema.org/ImageGallery">
{% for album in albums %}
<div class="gallery">
<a href="/albums/{{ album.id }}">
<img src="{{album.image_set.model.low}}" width="300" height="225">
</a>
<div class="desc">{{album}}</div>
</div>
{% endfor %}
</div>
I want to get value from Image model im that <img> tag. So, is it possible without refactoring all code entirely?
(Also, in the views.py I tried to get random image from album to set it as a preview, but it doesn't work too.)

Answer 1

In order to get the low value for the first Image in every Album you can do the following:
albums.html:
<div class="item2 my-gallery responsive" itemscope itemtype="http://schema.org/ImageGallery">
{% for album in albums %}
<div class="gallery">
<a href="/albums/{{ album.id }}">
<img src="{{album.image_set.first.low}}" width="300" height="225">
</a>
<div class="desc">{{album}}</div>
</div>
{% endfor %}
</div>
The only difference is {{album.image_set.first.low}} where we select the first item in the set.

Answer 2

From what I understand your current view returns a random image, which might not be related to the album at all. I would iterate through the albums and find a random image for each album if this is relevant. Like so:
def albums(request):
albums = Album.objects.all()
albums_list = []
for album in albums:
album_list.append({
album_images = Image.objects.filter(album=album)
'id'=album.pk,
'image_low'= album_images[random.randint(0, album_images.count() - 1)].low
'title'=album.title
})
paginator = Paginator(albums_list, 20)
page = request.GET.get('page')
albums = paginator.get_page(page)
context = {
'albums': albums,
'image': image,
}
return render(request, 'gallery/albums.html', context)
Then you can access the albums in the template like this
<div class="item2 my-gallery responsive" itemscope itemtype="http://schema.org/ImageGallery">
{% for album in albums %}
<div class="gallery">
<a href="/albums/{{ album.id }}">
<img src="{{album.image_low}}" width="300" height="225">
</a>
<div class="desc">{{album.title}}</div>
</div>
{% endfor %}
</div>