Как добавить раскрывающийся список «Многоуровневый» в шаблон Django? ⇐ CSS

[Anonymous]

Я пытаюсь добавить раскрывающийся список на панель навигации в base.html, в котором отображаются несколько категорий из магазина. С каждой из этих категорий связана подкатегория. Я создал модель в Django, которая отображает эти отношения следующим образом.
models.py

Код: Выделить всё

class CategoryView(models.Model):
parent = models.ForeignKey('self', related_name='children', on_delete=models.CASCADE, blank = True, null=True)
title = models.CharField(max_length=100)
created_at = models.DateTimeField(auto_now_add=True)

def __str__(self):
return self.title

И я передаю эту модель в шаблон, используя контекстные процессоры, вот так

Код: Выделить всё

def categoriesdropdown(request):
catg = CategoryView.objects.filter(parent=None)
context = {'catg':catg}
return context

Теперь я пытаюсь отобразить эти категории и подкатегории в виде многоуровневого раскрывающегося списка с помощью начальной загрузки. Я пробовал реализовать в основном все решения из ответов здесь:
Bootstrap 4: многоуровневый раскрывающийся список внутри навигации
Отсутствует раскрывающееся подменю Bootstrap
https://mdbootstrap.com/docs/standard/e ... ultilevel/
Но, похоже, ничего не работает.
Ниже приведен раскрывающийся список моего шаблона.
base.html

Код: Выделить всё

[url=#]Categories[/url]
[list]
{% for category in catg %}
[*]
[url=#]{{ category.title }}[/url]

{% for subcategory in category.children.all %}
[url=#]{{ subcategory.title }}[/url]
{% endfor %}
[/list]

{% endfor %}

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


Примечание. Переключатель раскрывающегося списка отображается как есть и не работает.
base.css

Код: Выделить всё

.dropdown-submenu {
position: relative;
}

.dropdown-submenu .dropdown-menu2 {
top: 10%;
left: 100%;
margin-top: -1px;
}

.navbar-nav li:hover > ul.dropdown-menu2 {
display: block;
}

Как заставить переключатели категорий работать и отображать подкатегории только при нажатии переключателя или наведении на него курсора?

Подробнее здесь: https://stackoverflow.com/questions/788 ... o-template