Uploading multiple images in Django with django-multiupload library

Question

I'm trying to use the below library to implement multi upload in my Django proejct.

https://github.com/Chive/django-multiupload

boutique/models.py

class Photo(models.Model):
    store = models.ForeignKey(Store)
    photo = models.FileField(null=True, blank=True, upload_to='boutique/index/%Y/%m/%d')
    url = models.CharField(max_length=40, null=True, blank=True, verbose_name='Image URL')
    created_at = models.DateTimeField(auto_now_add=True)

    def __unicode__(self):
        return str(self.photo)

    def get_absolute_url(self):
        return reverse('cms:photo_edit', args=[self.pk])

cms/forms.py

from django import forms
from boutique.models import Photo
from multiupload.fields import MultiFileField

class PhotoCreateForm(forms.ModelForm):
    class Meta:
        model = Photo
        fields = ['store']

    attachments = MultiFileField(min_num=1, max_num=3, max_file_size=1024*1024*5)

cms/views.py

class PhotoCreateView(FormView):
    model=Photo
    template_name='cms/photo_new.html'
    form_class = PhotoCreateForm
    success_url=reverse_lazy('cms:photo')
    queryset = Photo.objects.all()

    def form_valid(self, form):
        for each in form.cleaned_data['attachments']:
            Attachment.objects.create(file=each)
        return super(PhotoCreateView, self).form_valid(form)

cms/photo_new.html

{% extends 'cms/base.html' %}
{% load staticfiles %}

{% block page-header %}Add Photo{% endblock %}

{% block content %}
  <form action="" method="post">
    {% csrf_token %}
    <table class="table table-hover store-form">
      {{ form.as_table }}
    </table>
    <input class="btn btn-success btn-block" type="submit" name="" value="Submit">
    <br>
  </form>
{% endblock %}

FYI, I'm not using Django default admin, but my own customized admin, which is the app named cms. I'm also using models in the app named boutique. When I upload photos, nothing happens and the page doesn't even move to the success url. After submitting the files, the file input field just says "Thie field is required", and I don't see any uploads on the database. Is there something wrong on my codes?

Answer 1

Your Model name is Photo, then why you try to save photos at Attachment Model!

cms/views.py

class PhotoCreateView(FormView):
model=Photo
template_name='cms/photo_new.html'
form_class = PhotoCreateForm
success_url=reverse_lazy('cms:photo')
queryset = Photo.objects.all()

def form_valid(self, form):
    for each in form.cleaned_data['attachments']:
        Photo.objects.create(photo=each)
    return super(PhotoCreateView, self).form_valid(form)

If you want to upload any file or image then you need to add enctype="multipart/form-data" to your HTML form.

cms/photo_new.html

{% extends 'cms/base.html' %}
{% load staticfiles %}

{% block page-header %}Add Photo{% endblock %}

{% block content %}
    <form action="" method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <table class="table table-hover store-form">
          {{ form.as_table }}
        </table>
        <input class="btn btn-success btn-block" type="submit" name="" value="Submit">
        <br>
   </form>
{% endblock %}

Update this two file. hopefully, it'll work. If not then let me know.