CODEWITHSUNDEEP
djangodjango-formsdjango-templatesdjango-views
user11697164
user11697164

Reputation:

Django images in template through FK

I am using a detail view to show data and I have 2 models.

The problem is that one is FK of another and that ones storing pics and I need to show them. Can't find the solution. Because of the Detail view.

//HTML FILE THAT DISPLAYS THE PICTURES// file.html

{{object.hall_address}} ,{{object.hall_city}}<br>

I {{object.hall_owner}}, heartly invite you to have a great time.<br>



{% comment %} {% if object.images.hall_pic0 or object.images.hall_pic1 or object.images.hall_pic2 or object.images.hall_pic3 %}

<img src="{{object.images.hall_pic0.url}}" class="w3-circle" style="width:400px" alt="11"><hr width="15%">

<img src="{{object.HallProperties.hall_pic1.url}}" class="w3-round" style="width:400px" alt=""><hr width="15%">

<img src="{{object.HallProperties.hall_pic2.url}}" class="w3-round" style="width:400px" alt=""><hr width="15%">

<img src="{{object.HallProperties.hall_pic3.url}}" class="w3-round" style="width:400px" alt=""><br>




</div>


{% else %}
{% endif %} {% endcomment %}


{% for pictures in object.hallpictures_set %}
<img src="{{ pictures.hall_pic0.url }}" class="w3-circle" style="width:400px" alt=""><hr width="15%"></div><div class="zoom1">
<img src="{{ pictures.hall_pic1.url }}" class="w3-circle" style="width:400px" alt=""><hr width="15%"></div><div class="zoom1">
...
{% endfor %}
</div>

view.py

class HallDetail(DetailView):
    model = HallProperties
    template_name='hallfiles/hall-details.html'

models.py

class HallProperties(models.Model):
    hall_name = models.CharField(max_length = 128)

    hall_city = models.ForeignKey(CityModel.City, max_length=512)

    hall_owner = models.ForeignKey(
        HallOwnerData, on_delete=models.CASCADE, verbose_name="Hall Owner")

    parking_capacity = models.PositiveSmallIntegerField("Parking Capacity")


class HallPictures(models.Model):

    hall_properties = models.ForeignKey(
        HallProperties, on_delete=models.CASCADE, verbose_name="Hall link")

    hall_pic0 = models.ImageField(
        "Hall Picture 1", upload_to='media/hallpics', blank=True, null=True)

    hall_pic1 = models.ImageField(
        "Hall Picture 2", upload_to='media/hallpics', blank=True, null=True)

    hall_pic2 = models.ImageField(
        "Hall Picture 3", upload_to='media/hallpics', blank=True, null=True)

    hall_pic3 = models.ImageField(
        "Hall Picture 4", upload_to='media/hallpics', blank=True, null=True)

Upvotes: 0

Views: 75

Answers (2)

Daniel Roseman
Daniel Roseman

Reputation: 599470

You have a few issues here. The first one is that object is already the HallProperties object; there is no need to put object.HallProperties; presumably you have not done so for the other fields such as hall_name and hall_city.

Secondly, a foreign key is a one-to-many relationship. So you have multiple HallPictures items associated with each HallProperties. You would need to iterate through the pictures:

{% for pictures in object.hallpictures_set.all %}
<img src="{{ pictures.hall_pic0.url }}" class="w3-circle" style="width:400px" alt=""><hr width="15%"></div><div class="zoom1">
<img src="{{ pictures.hall_pic1.url }}" class="w3-circle" style="width:400px" alt=""><hr width="15%"></div><div class="zoom1">
...
{% endfor %}

Note that this structure is very odd. I don't know why you have a separate model, or why it has four separate picture fields on it. The point of having a separate model would be for it to only have a single image, and then your loop would just iterate over each separate object and output the image for each one.

Also note, it is Python and Django style to use singular names for models: HallProperty, HallPicture.

Upvotes: 1

Utkucan Bıyıklı
Utkucan Bıyıklı

Reputation: 1117

You should add related_name property for hall_properties in HallPictures model.

hall_properties = models.ForeignKey(
    HallProperties, on_delete=models.CASCADE, verbose_name="Hall link", related_name='images')

After you can access the image of object.

object.images.hall_pic0.url

Upvotes: 0

Related Questions