How to display images of a particular Blog post?

Question

models.py

class PostModel(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    date_time = models.DateTimeField(auto_now_add=True)
    title = models.TextField(null=True)
    body = models.TextField(null=True)
    def __str__(self):
        return str(self.user)

class ImagesPostModel(models.Model):
    post = models.ForeignKey(PostModel, on_delete=models.CASCADE)
    images = models.I

views.py

def show_posts(request):
    posts = PostModel.objects.filter(user=request.user)
    images = []
    for post in posts:
        images.append(ImagesPostModel.objects.filter(post=post))

    context = {
        'posts': posts,
        'images': images,
    }

    return render(request, 'show_posts.html', context)

show_posts.html

{% extends 'base.html' %}

{% block content %}

{% for post in posts %}

    {{post.title}}
    <br>
    {{post.body}}
    <br>
    {{post.data_time}}
    <br>
    {% for imgs in images %}
        {% for image in imgs %}
            {{image.post_id}}
            <img src="{{image.images.url}}" alt="postimage" style="width: 300px;">
        <br>
        {% endfor %}
    {% endfor %}

        <hr>
        <hr>
    {% endfor %}

{% endblock %}

I want the images of a post to be displayed which are related to that post only. But here all the images combined for all posts of a particular user are being displayed each time in every post. How to resolve it?

Answer 1

You put yourself in that dilemma, you can fix the view code to fix that easily

def show_posts(request):
    posts = PostModel.objects.filter(user=request.user)
    
    for post in posts:
        post.images = ImagesPostModel.objects.filter(post=post))

     context = {
         'posts': posts,
     }

   return render(request, 'show_posts.html', context)

and then you iterate over post.images in the template

OR you use post.images_set.all() to access the post images.

Answer 2

I would suggest you to use related_name for the post in your ImagePostModel . In your models.py you can do this.

class ImagesPostModel(models.Model):
    post = models.ForeignKey(PostModel, on_delete=models.CASCADE, related_name="imagePost")
    images = models.ImageField()

And then in your template use {{ post.imagePost.all }}

Answer 3

You can prefetch the images in bulk with:

def show_posts(request):
    posts = PostModel.objects.filter(
        user=request.user
    ).prefetch_related('imagespostmodel_set')
    context = {
        'posts': posts
    }
    return render(request, 'show_posts.html', context)

then in the template, you can access the .imagespostmodel_set of the post :

{% for post in posts %}
    …
    {% for image in post.imagespostmodel_set.all %}
        {{image.post_id}}
        <img src="{{image.images.url}}" alt="postimage" style="width: 300px;">
        <br>
    {% endfor %}
    …
{% endfor %}

---

Note : Models normally have no Model suffix. Therefore it might be better to rename PostModel to Post .