Как получить выпадающий список из базы данных в Django? (Uncaught TypeError: Cannot read properties of null (reading 'classList'))

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

{% if part_data.part.has_ML_Model %}

                <div class="btn-group">
                  <button type="button" class="btn btn-success dropdown-toggle"  id="dropdownMenuButton{{ forloop.counter }}" data-bs-toggle="dropdown"
                    aria-expanded="false">
                    {{ part_data.dropdown.0.dropdown_label }}
                  </button>

                  <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton{{ forloop.counter }}">
                    {% for dropdown in part_data.dropdown %}
                    <li><a class="dropdown-item" href="#">{{dropdown.dropdown_item_one}}</a></li>
                    <li><a class="dropdown-item" href="#">{{dropdown.dropdown_item_two}}</a></li>
                    <li><a class="dropdown-item" href="#">{{dropdown.dropdown_item_three}}</a></li>
                    {% endfor %}
                  </ul>

                </div>

                {% endif %}

** Моя модель : **

class CaseStudy_ML_Model(models.Model):
    case_study_part = models.ForeignKey(CaseStudy_Parts, on_delete=models.CASCADE,  null=True)
    dropdown_label = models.CharField(max_length=255  ,default="")
    dropdown_item_one = models.CharField(max_length=255,  default="")
    dropdown_item_two = models.CharField(max_length=255,  default="")
    dropdown_item_three = models.CharField(max_length=255,  default="")

**Мои взгляды: **

def casestudy(request, CaseStudy_id ):
    casestudy_object = get_object_or_404(CaseStudy_List, CaseStudy_id = CaseStudy_id) #for list
    casestudy_parts_obj = CaseStudy_Parts.objects.filter(case_study=casestudy_object).order_by('CaseStudy_order').distinct()  #for accordians
    
    parts_data = []  #storing in a singlist to avoid duplicacy 
    for part in casestudy_parts_obj:
        part_content = CaseStudy_Content.objects.filter(case_study_part = part)
        part_media = CaseStudy_Media.objects.filter(case_study_part = part)
        part_button = CaseStudy_Buttons.objects.filter(case_study_part = part) 
        part_dropdown = CaseStudy_ML_Model.objects.filter(case_study_part = part)
        
        # # Logic to determine if button required for media
        # has_button_for_media = False
        # # You can modify this logic based on your specific criteria
        # if part_media.exists() and part_button.exists():  # Check for media and buttons
        #     has_button_for_media = True
        
        parts_data.append({
            'part': part,
            'content': part_content,
            'media': part_media,
            'button': part_button,
            'dropdown': part_dropdown,
            # 'has_button_for_media': has_button_for_media, 
        })

    context = {
        'casestudy_object': casestudy_object,
        'parts_data': parts_data,
    }
    return render(request, 'casestudy.html', context)

**Моя ошибка : **

Uncaught TypeError: Cannot read properties of null (reading 'classList')
    at hi._isShown (dropdown.js:244:23)
    at hi.toggle (dropdown.js:120:17)
    at HTMLButtonElement.<anonymous> (dropdown.js:445:38)
    at HTMLDocument.n (event-handler.js:118:19)

Но когда я добавляю пустой шаблон bootstrap dropdown, то только выпадающий шаблон работает нормально. В противном случае, если я удаляю пустой шаблон выпадающего списка, он выдает ошибку.

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

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