djangomulti-upload

Uploading multiple images in Django with django-multiupload library


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?


Solution

  • 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.