The Project | About Us | Contribute | Donations | License
HOME My courses Completed
◄ Previous
◄

File Uploads

Next ►
►

In this section, we will cover how to handle file uploads in Django. File uploads are a common feature in web applications, and Django provides a straightforward way to manage them. We will go through the following key concepts:

  1. Setting up the media directory
  2. Creating a model to handle file uploads
  3. Creating a form to upload files
  4. Handling file uploads in views
  5. Displaying uploaded files

  1. Setting Up the Media Directory

First, we need to configure Django to handle media files. Media files are user-uploaded files, such as images, documents, etc.

Step-by-Step:

  1. Update settings.py:

    # settings.py

import os

# Add these lines at the end of the file
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

  2. Update urls.py:

    # urls.py

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # Your URL patterns here
]

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

  1. Creating a Model to Handle File Uploads

Next, we will create a model to store the uploaded files.

Step-by-Step:

  1. Create a new app (if you don't have one already):

    python manage.py startapp fileupload

  2. Define the model in models.py:

    # fileupload/models.py

from django.db import models

class Document(models.Model):
    title = models.CharField(max_length=100)
    uploaded_file = models.FileField(upload_to='documents/')
    uploaded_at = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return self.title

  3. Run migrations:

    python manage.py makemigrations
python manage.py migrate

  1. Creating a Form to Upload Files

We will create a form to allow users to upload files.

Step-by-Step:

  1. Create a form in forms.py:

    # fileupload/forms.py

from django import forms
from .models import Document

class DocumentForm(forms.ModelForm):
    class Meta:
        model = Document
        fields = ('title', 'uploaded_file',)

  1. Handling File Uploads in Views

We will create a view to handle the file upload process.

Step-by-Step:

  1. Create a view in views.py:

    # fileupload/views.py

from django.shortcuts import render, redirect
from .forms import DocumentForm
from .models import Document

def upload_file(request):
    if request.method == 'POST':
        form = DocumentForm(request.POST, request.FILES)
        if form.is_valid():
            form.save()
            return redirect('fileupload:upload_file')
    else:
        form = DocumentForm()
    documents = Document.objects.all()
    return render(request, 'fileupload/upload.html', {
        'form': form,
        'documents': documents
    })

  2. Update urls.py in the fileupload app:

    # fileupload/urls.py

from django.urls import path
from . import views

app_name = 'fileupload'

urlpatterns = [
    path('upload/', views.upload_file, name='upload_file'),
]

  1. Displaying Uploaded Files

Finally, we will create a template to display the uploaded files.

Step-by-Step:

  1. Create a template upload.html:

    <!-- fileupload/templates/fileupload/upload.html -->

<!DOCTYPE html>
<html>
<head>
    <title>File Upload</title>
</head>
<body>
    <h1>Upload a new document</h1>
    <form method="post" enctype="multipart/form-data">
        {% csrf_token %}
        {{ form.as_p }}
        <button type="submit">Upload</button>
    </form>

    <h2>Uploaded documents</h2>
    <ul>
        {% for document in documents %}
            <li><a href="{{ document.uploaded_file.url }}">{{ document.title }}</a></li>
        {% endfor %}
    </ul>
</body>
</html>

Practical Exercise

Task:

  1. Create a new Django project and app.
  2. Set up the media directory.
  3. Create a model to handle file uploads.
  4. Create a form and view to handle file uploads.
  5. Create a template to display the uploaded files.

Solution:

Follow the steps outlined above to complete the exercise. Ensure that you have configured the media settings correctly and that your form and view are handling file uploads as expected.

Common Mistakes and Tips

  • Forgetting to add enctype="multipart/form-data" in the form: This is necessary for file uploads.
  • Not configuring MEDIA_URL and MEDIA_ROOT correctly: Ensure these settings are correctly set in settings.py.
  • Not handling file uploads in the view properly: Make sure to use request.FILES to access the uploaded files.

Conclusion

In this section, we learned how to handle file uploads in Django. We covered setting up the media directory, creating a model, form, and view to handle file uploads, and displaying the uploaded files. This knowledge is essential for building web applications that allow users to upload and manage files. In the next module, we will dive into more advanced topics in Django.

◄ Previous
◄
Next ►
►
The Project | About Us | Contribute | Donations | License
© Copyright 2024. All rights reserved