Перетащите папку с кнопкой отправки, используя jQuery и Ajax

Question

Я работаю над проектом, в котором мне нужно перетащить папку для загрузки в базу данных. Я использую Django, jQuery и ajax для этой цели. Но проблема в том, что всякий раз, когда я пытаюсь отправить форму, я получаю эту ошибку:

Ошибка проверки CSRF. Запрос отменен.

Более того, он не работает в chrome, показывая эту проблему:

Этот сайт недоступен

Здесь мой код: View.py:

class BasicUploadView(View):
    def get(self, request):
        file_list = file_information.objects.all()
        return render(self.request, 'fileupload_app/basic_upload/index.html',{'files':file_list})

    def post(self, request):
        file_obj = file_store()
        zipfile = ZipFile('test1.zip','a',ZIP_DEFLATED)  #need to zip folder before storing
        if request.method == "POST":
            for upload_file in request.FILES.getlist('file'): 
                for chunk in upload_file.chunks():
                    zipfile.writestr(upload_file.name,chunk)                               
        zipfile.close()

        file_obj.file = File(open(zipfile.filename,'rb'))
        file_obj.fileName = os.path.basename(zipfile.filename)
        file_obj.save()
        data = {'name':file_obj.fileName, 'url':file_obj.fileName}
        return JsonResponse(data)

HTML:

<div style="margin-bottom: 20px;">
           <form id="my-form" method="POST" action="{% url 'fileupload_app:basic_upload' %}" enctype="multipart/form-data">
                 {% csrf_token %}
                 <div id="file-wrap">
                     <p>Drag and drop file here</p>
                 <input id="my-file" type="file" name="file" multiple draggable="true">
                 </div>
                  <div>
                    <input type="submit" value="upload"> 
                </div>
           </form>       
       </div>  

JS:

$(function () {
    var csrftoken = $.cookie('csrftoken');

    $("#my-file").on('change', function (e) { 
        $("#file-wrap p").html('Now click on Upload button'); 
    });

    $("#my-form").on('change', function (e) { 

        var eventType = $(this).attr("method"); 

        var eventLink = $(this).attr("action"); 

        $.ajax({

            type: eventType,

            url: eventLink,

            data: new FormData( this ), 

            cache: false,

            contentType: false,

            processData: false,

            success: function(getResult) {

                $('#my-form')[0].reset(); 

            }

        });

        e.preventDefault();


    )};
});

Как я могу решить эти проблемы? Пожалуйста, кто-нибудь, помогите мне разобраться в этом. Это будет высоко оценено.