Django - Display ImageField

Question

I've just started to use Django and I haven't found a lot of info on how to display an imageField, so I made this:

models.py:

class Car(models.Model):
    name = models.CharField(max_length=255)
    price = models.DecimalField(max_digits=5, decimal_places=2)
    photo = models.ImageField(upload_to='site_media')

views.py:

def image(request):
    carx = Car()
    variables = RequestContext(request,{
        'carx':carx
    })
    return render_to_response('image.html',variables)

image.html:

{% extends "base.html" %}
{% block content %}
   <img src=carx />
{% endblock %}

I already save an image since terminal and I know is there, also if a do this in image.html:

{% block content %}
    {{ carx }}
{% endblock %}

The output is: Car object

Can anyone tell me where is my error?

score 49 · Accepted Answer · answered Jul 24 '13 at 23:07

49

An ImageField contains a url attribute, which you can use in your templates to render the proper HTML.

{% block content %}
    <img src="{{ carx.photo.url }}">
{% endblock %}

answered Jul 24 '13 at 23:07

voithos

68,482
12
101
116

4

Assuming there's a server configured to serve content from `site_media`, anyway. – Peter DeGlopper Jul 24 '13 at 23:13
I have this in settings.py STATIC_URL ='/Users/gcarranza/PycharmProjects/django_bookmarks/site_media/' STATICFILES_DIRS = ( '/Users/gcarranza/PycharmProjects/django_bookmarks/site_media', ) – unixeo Jul 24 '13 at 23:17
It's more a question of having an actual web server configured - https://docs.djangoproject.com/en/dev/howto/static-files/#serving-files-uploaded-by-a-user shows how you can serve them from Django in development, but that's not a good idea in a production environment. – Peter DeGlopper Jul 24 '13 at 23:25
Not sure if this is a matter of version, but this approach of providing the variable alone in 'src' doesn't seem to work. – 101is5 Jan 18 '22 at 12:34

Vincent Verloop · Answer 2 · 2016-12-13T21:15:05.007

4

You can also make use of the Static URL in Settings.py. Make a directory for example "Uploads", in the Static directory of your app. Also change this in your model in models.py.

Use the following code:

<img src="{% static carx.photo.url %}" />

edited Dec 13 '16 at 21:15

answered Dec 13 '16 at 21:08

Vincent Verloop

41
2

3

Although this would work, you should not upload user files into /static, but into a /media folder. – Nasta Nov 29 '18 at 11:03

score -2 · Answer 3 · answered Jul 25 '13 at 08:48

Thanks to all, i fix it in this way.

views.py

def image(request):
carx = Car.objects.all()
for mycar in carx:
    MyCar = mycar.photo.url
variables = RequestContext(request,{
    'carx':MyCar
})
return render_to_response('image.html',variables)

image.html

{% extends "base.html" %}

{% block content %}
     <img src="{{ MEDIA_URL }}{{ carx }}"/>
{% endblock %}

settings.py

 MEDIA_URL = '/Users/gcarranza/PycharmProjects/django_bookmarks/'
 STATIC_URL = '/Users/gcarranza/PycharmProjects/django_bookmarks/site_media/'
 STATICFILES_DIRS = (
 '/Users/gcarranza/PycharmProjects/django_bookmarks/site_media',)

Now i know that carx.photo.url retrieve the absolute path of the file and its only matter to load as static file.

@unizeO please update your answer i already did but image not working — Mr Coder, Jul 14 '21 at 04:23

Django - Display ImageField

3 Answers3

Linked