How to display multiple self-related foreign key data in Django/HTML?

I am trying to create a django web app for displaying various data (a question and some additional data).My data consists of a question body and industry guidance, which contains several bullet points. Each bullet point may contain additional sub options itself as well, etc.

Example data:

Question body: Was everyone familiar with the location, purpose, testing and oepration of fire doors? Industry Guidance:

  1. Operational readiness
  2. Maintenance and testing
    • Regular inspections
    • Regular maintenance
      • Weekly
      • Monthly
    • ...

Below are my models:

class BaseGuidance(models.model):
    text = models.CharField(max_length=2000)
    parent = models.ForeignKey('self', on_delete=models.CASCADE, null=True, blank=True, related_name="sub_options")

    class Meta:
        abstract = True

    def __str__(self):
        return self.text

class IndustryGuidance(BaseGuidance):
    pass

class Question(models.model):
    body = models.CharField(max_length=400)
    industry_guidance = models.ForeignKey(IndustryGuidance, on_delete=models.CASCADE, null=True, blank=True)

Here is my view, which is rendering the HTML:

def index(request):
    questions = Question.objects.all()
    industry_guidance = IndustryGuidance.objects.prefetch_related(
        'sub_options',
    ).all()
    return render(request, "sire/index.html",{
        "questions": questions,
        "industry_guidance": industry_guidance
    })

Below is my HTML:

 <td scope="col"> 
            <ul class="list-group">
                {% for guidance in industry_guidance %}
                    <li>{{ guidance.text }} </li>
                    <ul>
                        {% for sub_option in guidance.sub_options.all %}
                            <li>{{ sub_option.text }}</li>
                        {% endfor %}
                    </ul>
                {% endfor %}
            </ul>
        </td>

I am really confused on to how exactly I should approach this problem in order to fetch all data and display accordingly.

I tried prefetch_related, but my web app would not load, apparently stuck into some for loop cycle. I am also thinking of rearranging my models but I could not find any guidance or best practices on the matter.

Ultimately, I would like to display each question in a table with its industry guidance related to it a list. Each sub option should be indented into another list. Each bullet of sub option should be in another list, and so on... All data regarding the question should be in the same row.

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