Bootstrap модал продолжать исчезать - PullRequest
Новая
       10

Bootstrap модал продолжать исчезать

0 голосов
/ 13 ноября 2018

Я пытался отобразить модальное после нажатия кнопки.Проблема в том, что модальное окно появляется, но затем автоматически закрывается.Я связал только два js-файла, которые являются bootstrap.js и jquery.js в разделе head.

Это мой раздел head: 

<head runat="server">
<title></title>

<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />

<script src="vendor/jquery/jquery.js"></script>
<script src="vendor/bootstrap/js/bootstrap.js"></script>

Этокод для кнопки: 

<asp:Button ID="btn1" runat ="server" data-toggle="modal" data-target="#PopupBookForm"/>

И это модальный код: 

 <div class="modal" id="PopupBookForm" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Event Form</h3>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="form-group ">
                        <asp:Label runat="server" Text="Meeting Title :"></asp:Label><br />
                            <asp:TextBox type="text" ID="meetTitle" class="form-control" runat="server"></asp:TextBox>
                        <br />
                         <asp:Label runat="server" Text="Date of Meeting :"></asp:Label><br />
                            <asp:TextBox type="text" ID="meetDate" class="form-control" runat="server"></asp:TextBox>
                        <br/>
                        <div class="form-inline">
                            <div class="form-group col-sm-6">
                                <asp:Label runat="server" Text="Meeting Start :"></asp:Label><br />
                                    <asp:TextBox type="text" ID="meetStart" class="form-control" runat="server"></asp:TextBox>
                            </div>
                            <div class="form-group col-sm-6">
                                <asp:Label runat="server" Text="Meeting End :"></asp:Label><br />
                                    <asp:TextBox type="text" ID="meetEnd" class="form-control" runat="server"></asp:TextBox>
                            </div>
                        </div>
                        <br />
                        <div class="form-inline">
                            <div class="form-group col-sm-6">
                                <asp:Label runat="server" Text="Plant :"></asp:Label>
                                    <select ID="plantDropDown"  class="form-control" style="width:200px">
                                        <option value="" disabled selected hidden>Select Plant</option>
                                    </select>
                            </div>
                            <div class="form-group col-sm-6">
                                <asp:Label runat="server" Text="Room :"></asp:Label>
                                    <select id="roomDropDown" class="form-control"  style="width:200px">
                                        <option value="" disabled selected hidden>Select Room</option>
                                    </select>
                            </div>
                        </div>
                        <br />
                        <asp:Label runat="server" Text="Meeting Description :"></asp:Label><br />
                            <asp:TextBox type="text" ID="meetDesc" class="form-control" runat="server" Textmode="multiline" Columns="50" Rows="5"></asp:TextBox>
                        <br />
                        <asp:Label runat="server" Text="Employee ID :"></asp:Label><br />
                            <asp:TextBox type="text" ID="empID" class="form-control" runat="server"></asp:TextBox>
                        <br />
                    </div>
                </div>
                <div class="modal-footer">
                    <asp:Button ID="BtnPopupCancel" CssClass="btn" runat="server" Text="Cancel"/>
                    <asp:Button ID="BtnPopupSave" CssClass="btn btn-outline-success" runat="server" Text="Save" />
                </div>
            </div>
        </div>
    </div>

Большое спасибо!

1 Ответ

0 голосов
/ 13 ноября 2018

ASP.NET Webforms генерирует пользовательский HTML для своих элементов управления на основе типа элемента управления и может переопределять события JavaScript, такие как onclick ...

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

Попробуйте использовать простой HTML-элемент: 

<button type="button" data-toggle="modal" data-target="#PopupBookForm">
     Launch demo modal
</button>
...