Не работает переключение между модальными окнами. Bootstrap

Рейтинг: 0Ответов: 0Опубликовано: 07.05.2023

Не хочет открываться второе модальное окно, не могу разобраться почему. Подскажите, пожалуйста

Подключены:

Код:

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css">

<div class="modal fade" id="addTaskModal" tabindex="-1" aria-hidden="true" aria-labelledby="addTaskModal" data-bs-backdrop="static">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <form class="form" name="CreateOrder">
        <div class="row gx-0">
          <div class="col-lg-8">
            <div class="task-modal-left">
              <h5 class="modal-title" id="addTaskModal">Создание заказа</h5>
              <div class="input-style-1">
                <label>Номер заказа/Счета</label>
                <input name="SalesNum" id="SalesNum" type="text" class="form-control" placeholder="Введите номер заказа" />
              </div>

              <div class="input-style-1">
                <label>Клиент</label>
                <input name="ClientName" type="text" class="form-control" placeholder="Введите наименование клиента" />
              </div>
            </div>
          </div>
          <div class="col-lg-4">
            <div class="task-modal-right">
              <button type="button" class="border-0 bg-transparent ms-auto close-button" data-bs-dismiss="modal">
                    <svg width="26" height="26" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path
                        d="M14.9999 13.2324L21.1874 7.04492L22.9549 8.81242L16.7674 14.9999L22.9549 21.1874L21.1874 22.9549L14.9999 16.7674L8.81242 22.9549L7.04492 21.1874L13.2324 14.9999L7.04492 8.81242L8.81242 7.04492L14.9999 13.2324Z"
                        fill="currentColor" />
                    </svg>
                  </button>
              <div class="row">
                <div class="col-6">
                  <button type="button" data-bs-dismiss="modal" class="btn btn-danger w-100">
                        Отмена
                      </button>
                </div>
                <div class="col-6">
                  <button class="btn btn-primary w-100" data-bs-target="#ModalSalesLine" data-bs-toggle="modal">
                        <i class="lni lni-plus me-1 text-sm text-bold"></i>
                        Создать
                      </button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>

<!-- ======== add task modal end =========== -->
<!-- ======== add task modal_2 start =========== -->

<div class="modal fade" id="ModalSalesLine" aria-hidden="true" aria-labelledby="ModalSalesLine" tabindex="-1" data-bs-backdrop="static">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <form class="form" name="CreateLine">
        <div class="row gx-0">
          <div class="col-lg-8">
            <div class="task-modal-left">
              <h5 class="modal-title">Создание строк</h5>
              <div class="input-style-1">
                <label>Номер заказа/Счета</label>
                <input name="SalesNum" id="SalesNum" type="text" class="form-control" placeholder="Введите номер заказа" />
              </div>

              <div class="input-style-1">
                <label>Комментарий</label>
                <input name="Comment" type="text" placeholder="Дополнительный комментарий (доступен только менеджеру)" rows="2" />
              </div>
            </div>
          </div>
          <div class="col-lg-4">
            <div class="task-modal-right">
              <button type="button" class="border-0 bg-transparent ms-auto close-button" data-bs-dismiss="modal">
                    <svg width="26" height="26" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path
                        d="M14.9999 13.2324L21.1874 7.04492L22.9549 8.81242L16.7674 14.9999L22.9549 21.1874L21.1874 22.9549L14.9999 16.7674L8.81242 22.9549L7.04492 21.1874L13.2324 14.9999L7.04492 8.81242L8.81242 7.04492L14.9999 13.2324Z"
                        fill="currentColor" />
                    </svg>
                  </button>
              <div class="row">
                <div class="col-6">
                  <button type="button" data-bs-dismiss="modal" class="btn btn-danger w-100">
                        Отмена
                      </button>
                </div>
                <div class="col-6">
                  <button class="btn btn-primary w-100" name="mandatory_fields">
                        <i class="lni lni-plus me-1 text-sm text-bold"></i>
                        Создать
                      </button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>

<a class="btn btn-primary" data-bs-toggle="modal" href="#addTaskModal" role="button">Open modal</a>

Ответы

Ответов пока нет.