Как сделать drag&drop с помощью dropzone js в django?

У меня есть сайт на django, и я хотел бы внедрить drag&drop в мою форму. Эта часть выглядит очень старой по сравнению с остальной частью сайта. Проблема в том, что я не знаю javascript, я пытался сделать это по учебникам, но ничего не понял. Я запутался еще больше, но сейчас у меня нет времени изучать js с нуля. Не могли бы вы помочь мне найти простое решение для этого. Мне предложили попробовать с dropzone js, но ничего не вышло, может кто-нибудь помочь мне создать это решение?

cal.py

def OnlyCAL(request):
    if request.method == "POST":
        form = DocumentForm(request.POST, request.FILES)
        if form.is_valid():
            output = io.BytesIO()
            newdoc = request.FILES['docfile']
                #pandas calculations

            response = HttpResponse(
                output, content_type='application/vnd.openxmlformats-officedocument.spreadsheetml.sheet')
            response['Content-Disposition'] = 'attachment; filename=%s' % filename
            return response
    else:
        form = DocumentForm()
    return render(request, 'cal.html', { 'form': form, 'page_title':page_title })

cal.html

{% extends "base.html" %}
{% load static %}
{% block content %}
      <form action="{% url "cal" %}" method="post" enctype="multipart/form-data" class="dropzone">
      {% csrf_token %}
      {{ message }}
      <p>{{ form.non_field_errors }}</p>
      <p>{{ form.docfile.label_tag }} {{ form.docfile.help_text }}</p>
      <p>
            {{ form.docfile.errors }}
            {{ form.docfile }}
      </p>
      <p><input type="submit" value="Upload and Download!"/></p>
      </form>
{% endblock content %}

urls.py

urlpatterns = [
    path('', views.home, name='home'),
    path('cal/', cal.OnlyCAL, name='cal'),
]

Нравится:

Вернуться на верх