Невозможно закрыть аккордеон bootstrap после закрытия модала

Я использую boostrap 5.1.3 и django-bootstrap-modal-forms 2.2.0 в моем django проекте.

Проблема в том, что когда я открываю модал, управляемый django-bootstrap-modal-forms, он изменяет css и поведение элементов bootstrap на странице.

Я иллюстрирую это с помощью элемента аккордеона.

    <div class="accordion" id="filters">

        <h2 class="accordion-header" id="headingOne">
          <button class="accordion-button collapsed" id="filtersButton" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne"
                  aria-expanded="false" aria-controls="collapseOne">
            Filters
          </button>
        </h2>
          <div class="accordion-body" id="accordion-body-filters">
              <div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                 <form action="" method="get" class="form form-inline" id="django-filter-form">
                   
Some form here

                </form>
              </div>
          </div>
    
    </div>


Модальный

                <div class="modal fade" tabindex="-1" role="dialog" id="modal">
                  <div class="modal-dialog" role="document">
                    <div class="modal-content"></div>
                  </div>
                </div>

модальное окно вызывается кнопкой

                    <button type='button' id='new-payment'
                            class="btn btn-secondary">
                    </button>

JS

<script type="text/javascript">
$(document).ready(function() {

    $("#new-payment").modalForm({
        formURL: "{% url 'Payment_register:add_payment' %}"
    });

});
</script>

Когда я открываю и затем закрываю модальное окно, я не могу закрыть аккордеон. Aria-expanded для #filtersButton всегда "true" и класс ".show" у #filtersButton остается, несмотря на нажатие на кнопку collapse. Говоря более точно, #collapseOne на мгновение получает класс "сворачивание", но затем снова становится "show". Единственный способ вернуть нормальное поведение аккордеона - обновить страницу.

Я также обнаружил, что ссылки cdn на bootstrap css и js каким-то образом добавляются в модальный html. Я использую те же самые, но в любом случае это может повлиять на нормальное поведение.

Как это исправить?

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