Django отображает данные из двух разных моделей

У меня есть две раздельные модели. Одна с двумя текстовыми полями и одна для нескольких изображений. Теперь я хочу отобразить все данные в одном html div. Что мне нужно изменить в представлении проектов и в файле projects.html?

models.py

class Project(models.Model):
    title = models.CharField(max_length=200)
    describtion = models.TextField(null=True, blank=True)

class ProjectImage(models.Model):
    project = models.ForeignKey(Project, on_delete=models.CASCADE)
    image = models.FileField(upload_to="products/")

forms.py

class ProjectForm(forms.ModelForm):
    class Meta:
        model = Project
        fields = ['title', 'describtion']

class ProjectImageForm(forms.ModelForm):
    class Meta:
        model = ProjectImage
        fields = ['image']
        widgets = {
            'image': ClearableFileInput(attrs={'multiple': True}),
        }

views.py

def createProject(request):
    form = ProjectForm()
    form2 = ProjectImageForm()

    if request.method == 'POST':
        form = ProjectForm(request.POST)
        form2 = ProjectImageForm(request.POST, request.FILES)
        images = request.FILES.getlist('image')
        if form.is_valid() and form2.is_valid():
            title = form.cleaned_data['title']
            describ = form.cleaned_data['describtion']
            project_instance = Project.objects.create(
                title=title, describtion=describ)
            for i in images:
                ProjectImage.objects.create(project=project_instance, image=i)

    context = {'form': form, 'form2': form2}
    return render(request, 'projects/project_form.html', context)

def projects(request):
    projects = Project.objects.all()
    context = {"projects":projects}
    return render(request, 'projects/projects.html', context)

projects.html

 {% for project in projects %}
          <div class="column">
            <div class="card project">
                <img class="project__thumbnail" src="{{project.image.url}}" alt="project thumbnail" />
                <div class="card__body">
                  <h3>{{project.title}}</h3>
                  <h2>{{project.describtion}}</h2>
                </div>
              </a>
            </div>
          </div>
{% endfor %}

Вам не нужно ничего менять.

Вы должны иметь возможность получить доступ к реверсу с помощью атрибута project.project_image_set в шаблоне:

<div class="card__body"
  <h3>{{project.title}}</h3>
  <h2>{{project.describtion}}</h2>
  {% for image in project.project_image_set.all %}
     {{ image.image }}
  {% endear %}
</div>

Документы: https://docs.djangoproject.com/en/4.0/topics/db/examples/many_to_one/

Я не совсем понимаю вопрос, но я вижу проблему в вашем шаблоне, учитывая, что вы используете внешний ключ в ProjectImage. И обновите вопрос

 {% for project in projects %}
          <div class="column">
            <div class="card project">
               {% for j in project.projectimage_set.all %}
                <img class="project__thumbnail" src="{{j.image.url}}" alt="project thumbnail" />
               {% endfor %}
                <div class="card__body">
                  <h3>{{project.title}}</h3>
                  <h2>{{project.describtion}}</h2>
                </div>
              </a>
            </div>
          </div>
{% endfor %}

Я бы заменил FileField на ImageField и добавил функцию:

@property
def get_photo_url(self):
    if self.image and hasattr(self.image, 'url'):
        return self.image.url
    else:
        return ''

Если функция createProject работает (я бы переименовал ее в create_project), то в projects.html:

{% for project in projects %}
      <div class="column">
        <div class="card project">
            <div class="card__body">
              <h3>{{project.title}}</h3>
              <h2>{{project.describtion}}</h2>
              {% for img in project.projectimage_set.all %}

            <img class="project__thumbnail" src="{{img.get_photo_url}}" alt="project thumbnail" />
              {% endfor %}
            </div>
          </a>
        </div>
      </div>

{% endfor %}

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