use image in html from database using django

Question

when i try display image from my database to html it's won't to show but all rest data are display ! so what is the error ?

my code

model :

class Homepage(models.Model):
name = models.CharField(max_length=50,default="")
app_contect = models.CharField(max_length=240,default="")
page_url = models.URLField(max_length=250,default="")
app_image = models.ImageField(upload_to='images/',null=True, blank=True)
def __str__(self):
    return self.name

views.py :

def home_page(request):
app = Homepage.objects.all()
page = request.GET.get('the_home_page', 1) # the_home_page is the name of pages when user go to page 2 etc
paginator = Paginator(app, 6) # 6 that's mean it will show 6 apps in page
try:
    appnum = paginator.page(page)
except PageNotAnInteger:
    appnum = paginator.page(1)
except EmptyPage:
    appnum = paginator.page(paginator.num_pages)

return render(request,'html_file/enterface.html', { 'appnum': appnum })

Html file :

{% for home_page in appnum %}

<label id="label_main_app"> <img id="img_main_app_first_screen" src="{{ home_page.app_image }}" alt="no image found !" height="160" width="165" > {{ home_page.name }} <br><br> <p id="p_size_first_page"> {{ home_page.app_contect}} <br> <br> <a href=" {{ home_page.page_url }} " type="button" class="btn btn-primary"><big> See More & Download </big>  </a> </p>
 </label>


 {% endfor %}

any help please ?

Neville Lemein · Accepted Answer · 2019-10-28 11:52:56Z

1

You could add a method in the model class to check if the image exists and has the .url attribute or return default image.

def get_image(self): if self.app_image and hasattr(self.app_image, 'url'): return self.app_image.url else: return '/path/to/default/image'

Then on the template {{ home_page.get_image }}

Another way would be to check for none and add default using Django template tags

{{ home_page.app_image.url|default_if_none:'/path/to/default/image' }}

edited Oct 28, 2019 at 11:52

answered Oct 28, 2019 at 11:33

Neville Lemein

1831 silver badge13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kutaiba H Momani Over a year ago

i just edit the 'image' and replace it with 'app_image' and it's work fine ! thanks bro it's work very good thank you very much

Neville Lemein Over a year ago

You are welcome. I also edited it for those who will need the answer in the future. Thanks.

Gjert · Accepted Answer · 2019-10-28 11:24:24Z

0

To display the image you simply use the tag {{ home_page.app_image.url }}. Note the .url at the end.

I would look up the file model in the Django docs.

If you make the ImageField optional I would recommand checking if it exists first:

{% if home_page.app_image %}
    {{ home_page.app_image.url }}
{% endif %}

edited Oct 28, 2019 at 11:24

answered Oct 28, 2019 at 11:16

Gjert

1,0672 gold badges19 silver badges50 bronze badges

11 Comments

Kutaiba H Momani Over a year ago

when i try {{ home_page.app_image.url }} i got this error ValueError at / The 'app_image' attribute has no file associated with it.

Gjert Over a year ago

@KutaibaHMomani Have you uploaded any file? Also is you Media Root settings set properly?

Kutaiba H Momani Over a year ago

yes i have uploaded photo and it's in my 'media/images' file and yes i have set the properly in settings like this : MEDIA_ROOT= os.path.join(BASE_DIR,"media") MEDIA_URL= "/media/"

Gjert Over a year ago

@KutaibaHMomani What Django version you using? I'll check if there have been any updates. However I doubt it. The reason you get app_image has no file associated with it is because no file is detected in the model e.g. no image saved with the model. So check your models again and make sure you have saved a image. This is default syntax from Django for the ImageFields, so there must be some typo in your code.

Kutaiba H Momani Over a year ago

when i use {{ home_page.app_image}} this message show to me in atom-terminal GET /images/qw.jpg HTTP/1.1" 404 5599 (can't load the image )

|

Collectives™ on Stack Overflow

use image in html from database using django

2 Answers 2

2 Comments

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related