Upload a CSV file using AJAX in Django

Question

I want to upload a CSV file using ajax query.

Template:

<form id="attendance-form" method="POST" enctype="multipart/form-data">
  <input type="file" id="upload-attendance" name="employee-attendance-file">
</form>

AJAX:

$("#upload-attendance").change(function(e) {
    e.preventDefault();  // disables submit's default action
    var input = $("#upload-attendance")[0];
    var employeeAttendanceFile = new FormData();
    employeeAttendanceFile.append("attendance-file", $('#upload-attendance')[0].files[0]);
    console.log(employeeAttendanceFile);
    $.ajax({
        url: '{% url "attendance:employee-attendance-upload" %}',
        type: 'POST',
        headers:{
            "X-CSRFToken": '{{ csrf_token }}'
        },
        data: {
            "employee_attendance_file": employeeAttendanceFile,
        },
    
        dataType: "json",
        success: function(data) {
            data = JSON.parse(data); // converts string of json to object
        },
        cache: false,
        processData: false,
        contentType: false,
        });
    });

After uploading a CSV file, when I console.log the file variable (console.log(employeeAttendanceFile);) nothing returns. When I fetch the ajax request from django view, it also returns None (print(csv_file)).

# views.py
class ImportEmployeeAttendanceAJAX( View):
    def post(self, request):
        csv_file = request.FILES.get("employee_attendance_file")
        print(csv_file)

What am I doing wrong?

Musa · Accepted Answer · 2020-09-14 16:42:16Z

1

When uploading data via a FormData object you have to pass it directly

    data: employeeAttendanceFile,

Also, the name you set for the file in the upload has to match when you try to access it.

    csv_file = request.FILES.get("attendance-file")

answered Sep 14, 2020 at 16:42

Musa

97.9k17 gold badges123 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

fahim irfan Over a year ago

Still same problem. csv_file returning None

Collectives™ on Stack Overflow

Upload a CSV file using AJAX in Django

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related