将 DropzoneJS 与 Django 一起使用时出现 MultiValueDictKeyError

MultiValueDictKeyError when using DropzoneJS with Django

我目前正在为网站制作个人资料图片功能,我开始使用 DropzoneJS,但在提交文件时遇到问题。图片将正常放入该区域,但上面显示 "X",当我将鼠标悬停在图片上时,我可以看到 MultiValueDictKeyError 错误。这与我在未选择文件的情况下单击提交按钮时遇到的错误相同。所以我假设问题是 button 没有提交文件?我该怎么做?

HTML/JS:

<script type='text/javascript'>

Dropzone.options.myDropzone = {

    init : function() {
        var submitButton = document.querySelector("#submitBtn")
        myDropzone = this;
        submitButton.addEventListener("click", function() {
            myDropzone.processQueue();
        });
        this.on("addedfile", function() {
            document.getElementById('submitBtn').style.visibility = "visible";
        });

        this.on('addedfile', function(){
            if (this.files[1]!=null){
                this.removeFile(this.files[0]);
            }
        });


    }
};

Dropzone.options.myAwesomeDropzone = {
  accept: function(file, done) {
    console.log("uploaded");

  },
  init: function() {
    this.on("addedfile", function() {
      if (this.files[1]!=null){
        this.removeFile(this.files[0]);
        //document.getElementById('submitBtn').style.visibility = "visible";
      }
    });
  }


};
</script>
<!-- Modal -->
<div id="picModal" class="modal">

  <!-- Modal content -->
  <div class="modal-content">
    <span class="close"></span>
    <form action="{% url 'profile_test' %}" method='POST' enctype="multipart/form-data" class="dropzone" id="my-dropzone">{% csrf_token %}
        <button id='submitBtn' type='submit' style='visibility: hidden;'> Submit </button>
        <input id='submit-all' type='file' name='uploaded_image'/>
            {{form}}
    </form>
  </div>

</div>

</body>

编辑

我将 autoProcessQueue: false, 添加到 myDropzone。当我将鼠标悬停在图片上时,我没有遇到问题。现在,当我按下提交时,它只会将我带到 MultiValueDictKeyError 错误页面

*编辑 2**

views.py

def profile_test(request):
    #going to use this view to display the profile page, and test alterations to it
    form = ImageUploadForm(request.POST, request.FILES)
    user = User.objects.get(id=request.user.id)
    if request.method == "POST": 
        print 'valid'
        user.userprofile.img = request.POST.get('uploaded_image', False)
        user.userprofile.save()
        return HttpResponseRedirect(reverse("profile_test"))
    else:
        print 'invalid'
        form = ImageUploadForm()

    return render(request, 'profile_test.html', {form:'form', user: 'user'})

我以前有 user.userprofile.img = request.FILES["uploaded_image"] 但后来改了,好像好多了。现在图像将落入该区域,当我将鼠标悬停在它上面时,我不会看到该错误。但是现在当我提交它时,dropzone 消失了,个人资料图片也没有改变。

我希望 img 属性是 FileField。对吗?

user.userprofile.img = request.POST.get('uploaded_image', False)

请试试这个。

user.userprofile.img = request.FILES.get('uploaded_image')
# if you have multiple files to upload
user.userprofile.img = request.FILES.getlist('uploaded_image')