Difference between revisions of "Images in models and uploading images"

From TRCCompSci - AQA Computer Science
Jump to: navigation, search
(Your Model)
(HTML Template)
 
(One intermediate revision by the same user not shown)
Line 45: Line 45:
 
form = DocumentForm(request.POST, request.FILES)
 
form = DocumentForm(request.POST, request.FILES)
 
</syntaxhighlight>
 
</syntaxhighlight>
 +
 +
=HTML Template=
 +
Now you need to make sure you set the enctype of the form:
 +
 +
[[File:Test..png]]

Latest revision as of 10:41, 20 May 2021

You will need to ensure a module called 'pillow' is installed.

Settings.py

In your 'settings.py' file you will need to add the following:

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Urls.py

You will need to add the following lines to the import statements at the top of the page:

from django.conf.urls.static import static
from .settings import MEDIA_ROOT, MEDIA_URL

Now in your 'urls.py' we need to add to your URL Patterns, so after the 'urlpatterns' add the following line:

urlpatterns += static(MEDIA_URL, document_root=MEDIA_ROOT)

Your Model

If you have already followed the tutorials on django, you would have created a model (probably for products). We now need to edit this model to add an 'ImageField' for the product.

product_pic = models.ImageField(upload_to = 'products/', default = 'products/no-img.jpg')

The parameters above will set the location and also a default image to use if no image is uploaded. Now in the form for this model you will need to add 'product_pic' by including it in the list of fields:

    class Meta:
        model=Product
        fields = ['name','manufacturer','description','product_pic']

Views.py

Now we need to pass the files uploaded into the view, so find your view to add products to the product model. It will currently have 'request.POST' as a parameter for the form, you need to also add 'request.FILES':

form = DocumentForm(request.POST, request.FILES)

HTML Template

Now you need to make sure you set the enctype of the form:

Test..png