Question

我已经有一段时间遇到这个问题了，我找不到解决方案，我正在尝试使用dropzone.js上传图片而form.is_valid() 失败。传递错误：This field is required. 你能帮我理解我做错了吗？

models.py：

class Image(models.Model):
    item_id = models.ForeignKey(Item,blank=True,null=True)
    image = models.ImageField(upload_to='item_images/%Y/%m/%d')
    def __unicode__(self):
        return smart_unicode(self.image)

forms.py:

class ImageForm(forms.ModelForm):

    class Meta:
        model = Image
        exclude = ['item_id']

views.py：

def upload_image(request):
    if request.method == 'POST':
        form = ImageForm(request.POST, request.FILES)
        if form.is_valid():
            result = 'success'
        return render(request, 'page.html', {'form':form})

page.html：

        <form class="dropzone" id="myDropzone" action="/upload_image/" method="post" enctype="multipart/form-data">
            {% csrf_token %}
        </form>

Answer 1

表单需要输入类型为“file”且名称为“image”的输入。

Answer 2

我不知道我现在展示的内容是否会对您有所帮助，但您可以在不使用表格的情况下这样做，也可能会帮助其他人。使用dropzone让我做了一个解决方法，因为ajax，文件和django组合总是有点复杂。

所以在我的HTML中我有这段代码：

<div class="logos">
  <i class="fa fa-upload" id="dropzone_icon" data-name="icon" title="{% trans "Drag and drop or click" %}" alt="{% trans "Drag and drop or click" %}" ></i>
  <input type="hidden" name="icon" value="" >
  <input type="hidden" name="icon_name" value="" >
  <div class="img-holder">
    <img title='{% trans "Upload a Company Icon" %}' id="img_icon" alt='{% trans "Company icon" %}' src="{* icon *}"/>
  </div>
  <label>{% trans "Company Icon" %}</label>
</div>

在我的js中我得到了这个：

dropz = new Dropzone(value, {
    url: "branding/dropzone",
    maxFiles: 1,
    acceptedFiles: "image/*",
    thumbnail: function(file, dataUrl) {
        /* change existing image */
        var file_type = file.name.split('.');
        file_type = file_type[file_type.length - 1];
        if(!(file_type=="png" || file_type=="jpg" || file_type=="jpeg")){
            createAlert('file type must be .png, .jpg or .jpeg', '#pp_content', 'alert');
            return false;
        }
        $("input[name='icon']").val(dataUrl.split(",")[1]);
        $("input[name='icon_name']").val(file.name);
        $("#img_" + type).prop("src", dataUrl);
        this.removeFile(file);
    },
    previewTemplate: "<span></span>",
    autoProcessQueue: false
});

这告诉dropzone将值插入到输入中（图像的base64表示和文件名）所以基本上我将图像作为字符串发送。

将输入作为ajax中的表单发送后，这就是我在views.py中处理它们的方式：

import datetime
from django.core.files.base import ContentFile

def base64_to_image(img_b64,img_name):
"""
Creates image file from bas64 encoded data
:param img_b64: base64 data
:param img_name: filename for created image
:return: file or false if there's no data
"""
if img_b64:
    image_data = b64decode(img_b64)
    img_file = ContentFile(image_data,datetime.datetime.now().strftime("%y%d%m_%H%M%S") + img_name)
    return img_file
else:
    return False

company.icon = base64_to_image(request.POST["icon"], request.POST["icon_name"])
company.save()

这是我使用dropzone的工作，也许它会帮助其他人

使用dropzone上传Django图像

2 个答案: