django: Images are not loading - django

Question

I need to show images in templates. The images are fetched from models. My models.py reside in an app named services:
class Car_model(models.Model):
name = models.CharField (max_length = 25, blank=False)
...
category = models.ForeignKey (Category, on_delete=models.CASCADE)
photo = models.ImageField (upload_to ='static/images/models')
I have added these lines in my settings.py:
STATIC_ROOT = os.path.join(BASE_DIR, 'media') # i added it later
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static'),
]
I have also added this line in my project_name's urls.py file:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
I am trying to get the images in my templates through this code:
{% load static %}
{% for c in ca %}
<p><strong>{{ c.car_no }}</strong>--<em>{{ c.car_model }}</em>--{{ c.garage }}</p>
<img src="{{ c.car_model.photo.url }}" height="200" />
<form action="{%url 'booking' c.id c.garage.id %}" method="POST">
{% csrf_token %}
<input type="submit" name="the_selected_car" value="Select this car">
</form>
{% endfor %}
But whatever I try photos aren't showing. I tried by placing this:
+ static(settings.STATIC_URL, document_root=settings.STATIC_ROOT) in my services app's urls.py but that didn't help.

Answer 1

You forget to add MEDIA_ROOT and MEDIA_URL in settings.py and load media urls in urls.py
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
and in urls.py
urlpatterns = [
........
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Your could Refactor your upload_to in photo field
1. If you want to upload images in static director
photo = models.ImageField (upload_to ='static/images/models')
And set static folder in MEDIA_ROOT as below
MEDIA_ROOT = os.path.join(BASE_DIR, 'static')
2. If you want to upload images in media director
Since your are storing uploaded images I would suggest store in defferent director like media , uploads
Change your field as below.
photo = models.ImageField (upload_to ='media/images/car_model')
Now All your images related to Car_Model will be saved inside media/images/car_model
And set media folder in MEDIA_ROOT as below MEDIA_ROOT as below
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Answer 2

you didn't include MEDIA Urls in your urls.py
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)