Checking Form Uploading Progress in Django

Is it possible to track the user form upload progress in the current page before browser redirects to the form's actions attribute?

In Django's template, I have a form like below;

It accepts user data such as name, age and multiple images from input field. If I upload large image here, I need to wait for more time before it redirects to success page. If i can see progress bar or something that confirms the remaining time for form's successful submission page, it will be better

{% extends "base.html" %}
{% block content %}
{% if form.errors %}
        <p style="color: red;">
            Please correct the error{{ form.errors|pluralize }} below.
{% endif %}
<div data-role="content" style="padding: 15px">
    <form action="{% url success %}" method="POST" enctype="multipart/form-data">
            {% csrf_token %}
            {{ form.errors }}
            {{ form.non_field_errors }}
            {{ form.as_table }}
        <input type="submit" value="Submit" id="Save">
{% endblock %}

This is not possible with Django per-se, as this would be implemented with JavaScript or a similar client side language. Using JavaScript you could add a Django endpoint where you upload the data and then use AJAX to asynchronously send the data to the endpoint. You can show the progress bar, as this is on the client side. This way however you couldn't use a Django form for this part of the upload.

There are a lot of libraries and snippets for JS to implement the progress bar, so the implementation of this shouldn't be too difficult.

Back to Top