Загрузка нескольких изображений в одном сообщении

У меня views функция которая обрабатывает две формы. В форме "CatForm" данные и фото, в форме "PhotoForm" только фото. Они связаны между собой. Есть html виджет который загружает сразу несколько фото с предпросмотром в форму "PhotoForm". Точнее, должен так делать. Проблема в том, что views функция принимает из "PhotoForm" только одно фото из нескольких, и только если html виджет написан через тег {% for form1 in formset %} {% endfor %}, в противном случае он его просто не видит. Как мне сделать что бы views функция принимала все фото из html виджета? Ниже мой код.

Views.py '

def create_post(request):
PhotoFormSet = modelformset_factory(Photo,
                                    form=PhotoForm, extra=3)

if request.method == 'POST':

    catForm = CatForm(request.POST or None, files=request.FILES or None)
    formset = PhotoFormSet(request.POST, request.FILES,
                           queryset=Photo.objects.none())

    if catForm.is_valid() and formset.is_valid():
        cat_form = catForm.save(commit=False)
        cat_form.person = request.user
        cat_form.save()

        for form in formset.cleaned_data:
            if form:
                image = form['photos']
                photo = Photo(post=cat_form, photos=image)
                photo.save()
        messages.success(request,
                         '/')
        return HttpResponseRedirect("/public")
    else:
        print(catForm.errors, formset.errors)
else:
    catForm = CatForm()
    formset = PhotoFormSet(queryset=Photo.objects.none())
return render(request, 'content/create_post.html',
            {'form': catForm, 'formset': formset})'

JS '

 let lists = [];

function handleFileSelect(evt) {
var files = evt.target.files;
for (var i = 0, f; f = files[i]; i++) {
  if (lists.length > 3) return;
  if (!f.type.match('image.*')) {
    continue;
  }
  var reader = new FileReader();
  reader.onload = (function(theFile) {
    return function(e) {
      lists.push(theFile.name);
      var span = document.createElement('span');
      span.innerHTML = [
        '<img class="file-upload-image" src="',
        e.target.result,
        '" title="', escape(theFile.name),
        '"/>'
      ].join('');
      document.getElementById('lists').insertBefore(span, null);
    };
  })(f);
  reader.readAsDataURL(f);
}
}

document.getElementById('filess').addEventListener('change', handleFileSelect, false);
'

form.py '

class CatForm(forms.ModelForm):
def __init__(self, *args, **kwargs):
    super().__init__(*args, **kwargs)
    self.fields['cat'].empty_label = "Раздел не выбран"
class Meta:
    model = Asnt
    fields = ('title', 'text', 'price', 'region', 'contacts','cat', 'image')
    widgets = {
        'title': forms.TextInput(attrs={'class': 'form-control', 'placeholder': "Введите название"}),
        'price': forms.TextInput(attrs={'class': 'form-control', 'placeholder': "Цена в рублях"}),
        'region': forms.TextInput(attrs={'class': 'form-control', 'placeholder': "Укажите регион"}),
        'contacts': forms.TextInput(attrs={'class': 'form-control', 'placeholder': "Ваши контакты для связи"}),
        'text': forms.Textarea(attrs={'class': 'form-control', 'rows':4, 'placeholder': "Введите описание"}),
        'cat': forms.Select(attrs={'class': 'form-control'}),
        'image': forms.FileInput(attrs={'class': 'form-con', 'id': 'files', 'multiple': True}),
    }

def clean_text(self):
    data = self.cleaned_data['text']
    if data == '':
        raise forms.ValidationError('Поле не может быть пустым')
    return data


class PhotoForm(forms.ModelForm):
   #label='Images' 
class Meta:
    model = Photo
    fields = ('photos',)
    widgets = {
        'photos': forms.FileInput(attrs={'class': 'form-con form_img', 'id': 'filess', 'multiple': True}),
    }'

models.py '

class Asnt(models.Model):
title = models.CharField(max_length=100, verbose_name= 'Заголовок')
text = models.TextField(verbose_name= 'Описание')
region = models.CharField(max_length=100, verbose_name= 'Регион', default='')
contacts = models.TextField(verbose_name= 'Контакты', default='')
price = models.TextField(verbose_name= 'Цена', default='')
pub_date = models.DateTimeField(auto_now_add=True, verbose_name= 'Дата публикации')
cat = models.ForeignKey(
    Cat, on_delete=models.SET_NULL,
    related_name='content',
    blank=True,
    null=True,
    verbose_name= 'Раздел'
)
person = models.ForeignKey(
    User,
    on_delete=models.CASCADE,
    related_name='person',
    verbose_name= 'Автор'
)
image = models.ImageField(
    'Превью',
    upload_to='content/',
    blank=True
)


class Meta:
    ordering = ['-pub_date']
    verbose_name = 'Пост'
    verbose_name_plural = 'Объявления'

def __str__(self):
    return self.text[:15]


class Photo(models.Model):
    post = models.ForeignKey(Asnt, default=None, on_delete=models.CASCADE)
    photos = models.ImageField(
        'Фото',
        upload_to='content/',
        blank=True
    )

def __str__(self):
    return self.post.title'

html '

            {% for form1 in formset %}
              <div class="file-upload">
                <div class="image-upload-wrap">
                  {{form1.photos}}
                </div>
                <output id="lists"></output>
                <a href="#" onclick="removeImage(this);">remove image</a>
                <div class="file-upload-content">
                  <div class="image-title-wrap">
                    <botton type="button" onclick="removeUpload()" class="remove-image"> 
                    </botton>
                  </div>
                </div>
              </div>
            {% endfor %}'

Вернуться на верх