Как использовать Django для цикла дважды на одних и тех же данных

Question

Я пытаюсь использовать цикл for для повторения одних и тех же данных дважды в одном и том же шаблоне Django. Однако второй цикл for возвращает только первый объект в базе данных.

В основном у меня есть изображение каждой работы в базе данных на домашней странице, и при нажатии на нее должно отображаться более подробное описание этой работы. Все задания из базы данных отображаются нормально на главной странице, но все они отображают описание первого задания при нажатии.

Я думаю, что это связано с возможностью использовать итератор только один раз, но я не могу понять, каково решение.

model.py

from django.db import models

class Job(models.Model):
    title = models.CharField(max_length=50, default="Example Work")
    image = models.ImageField(upload_to='images/')
    summary = models.TextField()

views.py

from django.shortcuts import render
from .models import Job

def get_index(request):
    jobs = Job.objects
    return render(request, 'index.html', {'jobs': jobs})

index.html

{% for job in jobs.all %}
  <div class="col-md-6 col-lg-4">
    <a class="portfolio-item d-block mx-auto" href="#portfolio-modal">
      <div class="portfolio-item-caption d-flex position-absolute h-100 w-100">
        <div class="portfolio-item-caption-content my-auto w-100 text-center text-white">
          <i class="fas fa-search-plus fa-3x"></i>
        </div>
      </div>
      <img class="img-fluid" src="{{ job.image.url }}" alt="">
    </a>
    <h3 class="text-center text-secondary">{{ job.title }}</h3>
  </div>
{% endfor %}
<!-- Portfolio Modal -->
{% for job in jobs.all %}
  <div class="portfolio-modal mfp-hide" id="portfolio-modal">
    <div class="portfolio-modal-dialog bg-white">
      <a class="close-button d-none d-md-block portfolio-modal-dismiss" href="#">
        <i class="fa fa-3x fa-times"></i>
      </a>
      <div class="container text-center">
        <div class="row">
          <div class="col-lg-8 mx-auto">
            <h2 class="text-secondary text-uppercase mb-0">{{ job.title }}</h2>
            <hr class="star-dark mb-5">
            <img class="img-fluid mb-5" src="{{ job.image.url }}" alt="Image of website">
            <p class="mb-5">{{ job.summary }}</p>
            <a class="btn btn-primary btn-lg rounded-pill portfolio-modal-dismiss" href="#">
              <i class="fa fa-close"></i>Close Project</a>
          </div>
        </div>
      </div>
    </div>
  </div>
{% endfor %}

Просто для контекста, я вырвал много html-кода из index.html, потому что все работает нормально и, вероятно, не актуально. Я попробовал это в течение одного цикла, который тоже не работает. Описание открывается в новом окне на той же странице. Я пробовал все, что мог придумать, но ничего с этим не получал. По-прежнему сталкиваюсь с Django и Python. Любая помощь приветствуется.

Answer 1

Это не имеет ничего общего с выводом Django одинаковых данных для каждой итерации.Если вы проверите сгенерированный HTML через View Source в своем браузере, вы обязательно увидите правильные данные.

Проблема связана с самим вашим HTML.Вы не можете иметь несколько элементов с одним и тем же атрибутом HTML id;но вы используете id="portfolio-modal" для каждого.Когда ваш JS пытается открыть модальное окно, он найдет только первый экземпляр этого идентификатора.

Вам нужно использовать разные идентификаторы в каждой итерации - возможно, добавив уникальный элемент, например, Job pk- и / или использовать класс для запуска вашего модального.