Question

这个问题使我整个周末都丧命，因此，感谢您能获得的所有帮助。

我有一个按类别上传报告的表格。当提交没有ajax的表单时没有问题。但是当我切换到ajax时，ajax不会将文件数据发送到服务器。

print(self.request.FILES)

返回

<MultiValueDict: {}>

这是html形式的脆皮输出，因此 enctype =“ multipart / form-data ”确实存在。

<form action="" class="form-horizontal my-2 mx-2" id="newReportForm" method="post"  enctype="multipart/form-data">

views.py

class ProjectMainView(View):
    def get(self, request):    
        template_name = 'SiteMangement/index.html'
        form_class = newReportForm
        return render(self.request, template_name, {'form': form_class})  

    def post(self, request):
            if request.is_ajax():
                print(self.request.FILES)
                data = self.request.POST
                form = newReportForm(self.request.POST,self.request.FILES)     
                form.save(commit=False)

                if form.is_valid():
                    data = {'is_valid' : True}
                    form.save()
                else:
                    print(form.errors)
                    data = {'is_valid' : False, 'form_errors' : form.errors}

                return JsonResponse(data)

我的Ajax帖子

$(document).ready(function() {
       var newRepForm = $('#newReportForm');
        newRepForm.submit(function(event){
            $.ajax({       
            type: "POST",
            url: "",
            dataType: 'json',
            data: { 
                  report_type :$('#id_report_type').val() ,
                  report_projects :$('#id_report_projects').val(),
                  report_date : $('#id_report_date').val(),
                  report_name:$('#id_report_name').val(),
                  report_file: $('#id_report_file').val()


},
            success: function (data) {
                $('#message').html("<p class='text-center text-success font-weight-bold'>Success</p>");


            },
            error: function(data) {
                $("#message").html("<p class='text-center text-danger font-weight-bold'>Failed</p>");
            }
        });
          return false;
       });

});

Answer 1

通过FormData支持通过AJAX上传文件。

应该是这样的

newRepForm.submit(function(event){
    var formData = new FormData(newRepForm[0]);
    $.ajax({   
       url: "",    
       type: 'POST',
       data: formData,
       async: false,
       cache: false,
       contentType: false,
       enctype: 'multipart/form-data',
       processData: false,
       success: function (data) {
          $('#message').html("<p class='text-center text-success font-weight-bold'>Success</p>");
       },
       error: function(data) {
            $("#message").html("<p class='text-center text-danger font-weight-bold'>Failed</p>");
       }
    });
    return false;
});

DJANGO-AJAX request.files为空

1 个答案: