Мне нужно указать идентификатор в Django, чтобы позже добавить его в начальной загрузке

Question

Я хочу сделать портфолио в django, у меня есть раздел в html, где {% for ...%} я подключаю его к списку вакансий в dajngo, чтобы показать фотографии, резюме и заголовок моей работы, но в html-кодев этом div есть идентификатор, который вызывает другой div в коде, и когда я выполняю цикл for, этот id просто повторяется сам, как я могу изменить этот id для автоматического изменения? `

{% for job in jobdic.all %}
      <div class="col-md-6 col-lg-4">
        <a class="portfolio-item d-block mx-auto" **href="#portfolio-modal-1"**>
          <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>
            <p>{{ job.summary }}</p>
          <img class="img-fluid" src="{{ job.image.url }}" alt="{{job.title }}">
        </a>
      </div>
    {% endfor %}

проблемная область находится в href, который вызывает другой раздел в html с portfolio-modal-1, мне нужно написать некоторый код, который может быть изменен для этого портфолио-модального-1 на портфолио-модального-2 и 3 и ... автоматически этораздел, к которому он относится:

 {% for job in jobdic.all %}
<div class="portfolio-modal mfp-hide" id="portfolio-modal-1">
  <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">Project Name</h2>
          <hr class="star-dark mb-5">
          <img class="img-fluid mb-5" src="{{ job.image.url }}" alt="">
          <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 %}

Answer 1

Вероятно, лучше использовать идентификатор / первичный ключ каждого задания:

<!-- in first loop -->
<a class="portfolio-item d-block mx-auto" href="#portfolio-modal-{{ job.pk }}">

<!-- in second loop -->
<div class="portfolio-modal mfp-hide" id="portfolio-modal-{{ job.pk }}">

В качестве альтернативы используйте вместо него тег шаблона {{ forloop.counter }}.Документы находятся внизу в этом разделе .