* Кнопка Bootstrap, чтобы показать модал, должна быть нажата много раз, чтобы открыть модал - PullRequest
Новая
       7

* Кнопка Bootstrap, чтобы показать модал, должна быть нажата много раз, чтобы открыть модал

0 голосов
/ 20 февраля 2020

Я использую Bootstrap4, и в моей панели навигации у меня есть кнопка, чтобы открыть модал. Я добавил jquery, поппер и bootstrap js в правильном порядке, как указано на сайте bootstrap. Мне нужно нажать эта кнопка 5-6 раз непрерывно, чтобы открыть модальное 

<asp:Button ID="btnUserDetails" runat="server" Text="USER DETAILS" data-toggle="modal" data-target="#userDetails" />

мой модальный 

<div class="modal fade" id="userDetails" tabindex="-1" role="dialog" >
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
       <asp:Label ID="lblLoginID" runat="server"></asp:Label><br />
        <asp:Label ID="lblIPAddress" runat="server" ></asp:Label><br />
        <asp:Label ID="lblSystemName" runat="server" ></asp:Label><br />
        <asp:Label ID="lblVersionInfo" runat="server" ></asp:Label>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

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

<asp:Button ID="btnUserDetails" runat="server" Text="USER DETAILS" data-toggle="modal" data-target="#userDetails"  OnClientClick="return openmodal();return false;" />


<script type="text/javascript">
 function openmodal() {
 $('#userDetails').modal('show');
}
 </script>

Однако это не работает. Моя javascript функция вызывается, когда я помещаю предупреждающее сообщение и проверяю. Что-то странное происходит с вертикальной полосой прокрутки, хотя при нажатии кнопки она появляется некоторое время на щелчок кнопки и исчезает, я думаю, как только событие нажатия кнопки заканчивается.

1 Ответ

0 голосов
/ 23 февраля 2020

Проблема с "fade" в модале 

<div class="modal fade" id="userDetails" tabindex="-1" role="dialog" >

я удалил fade и использовал "show", и модал работает 

<div class="modal show" id="userDetails" tabindex="-1" role="dialog" >

также я добавил javascript функция для кнопки, которая запускает модель 

<script>
   $( '#btnUserDetails').click( function(){
    $( '#userDetails').modal('show');
        });
</script>
...