Как создать модальное окно asp.net mvc?

как говорится, толи я дурак толи лыжи не едут. не могу найти адекватной инфы по модальным окнам вот нашла на бутстреп:
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>


но по нажатию кнопки ничего не происходит. то бишь я создала просто чисто проверить asp mvc проект и вставила это в index.
суя по всему нужно что-то еще прописать но я не могу найти что именно

а так мне надо представление просто под модалку переделать. но смысл о б этом говорить если я даже окно вызвать не могу

я нашла пример который единственный у меня работает вот с такой шапкой:
<base href="https://itchief.ru">
        <link href="/examples/libs/bootstrap-5/bootstrap.min.css" rel="stylesheet">
    <script defer src="/examples/libs/bootstrap-5/bootstrap.bundle.min.js"></script>


но это какой-то костыль указываеющий на конкретный сайт. если я все это заменю на
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

работать перестанет
  • Вопрос задан
  • 1013 просмотров
Решения вопроса 1
@valeryalastor Автор вопроса
оказывается по-умолчанию файлы были 4.0 bs а я пыталась работать с 5.0. как только скачала в офиц сайта новые файлы и все заработало с помощью 2х строк:
<link href="~/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <script src="~/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Planet_93
@Planet_93
Пример вы взяли видимо отсюда https://getbootstrap.com/docs/4.0/components/modal/

Посмотрите первый абзац Getting started

Проверьте что вы подключили не только файл стилей bootstrap.min.css, но и файлы js - jquery-3.2.1.slim.min.js, bootstrap.min.js.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы