Asp.net Нажатие кнопки во всплывающем окне Jquery Modal

Question

В моем приложении asp.net я использовал модальное всплывающее окно с использованием Jquery. Внутри всплывающего окна у меня есть кнопка asp.net. В котором мне нужно написать код на стороне сервера для вставки данных в базу данных. Но когда я нажимаю на кнопку, модальное всплывающее окно закрывается. Я хочу держать модал всплывающим при нажатии кнопки. Ниже мой HTML-код,

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
                <div class="modal-body">
                    <div class="row route-for-reg">
                        <div class="routes-container">
                            <div class="row padding-tb-10">
                                <div class="col-md-4 col-lg-3">
                                    <asp:DropDownList ID="dpPickupLocation" CssClass="form-control ng-pristine ng-untouched ng-valid ng-valid-required " data-placeholder="Choose pickup point..." runat="server">
                                        <asp:ListItem>as</asp:ListItem>
                                    </asp:DropDownList>

                                </div>
                                <div class="col-md-4 col-lg-3">
                                    <asp:DropDownList ID="dpDropLocation" CssClass="form-control ng-pristine ng-untouched ng-valid ng-valid-required" data-placeholder="Choose Hinjewadi drop point..." runat="server"></asp:DropDownList>
                                </div>

                                <div class="col-md-6">
                                    <asp:UpdatePanel ID="modalPanel" runat="server"><ContentTemplate>


                                    <asp:Button ID="btnViewRoutes" runat="server" Text="View All Routes" OnClick="btnViewRoutes_Click"  CausesValidation="false" />
                                    </ContentTemplate></asp:UpdatePanel>
                                </div>
                            </div>
                            <div id="accordion-resizer" class="row padding-tb-10">
                            <div id="accordion">
                                    <h3>Pickup</h3>
                                    <div>
                                        <asp:Label ID="lblHolderPickup" runat="server" Text="There are no routes available"></asp:Label>
                                        <asp:GridView ID="gridPickUp" runat="server" CssClass="routes-list"></asp:GridView> 
                                    </div>
                                    <h3>Drop</h3>
                                    <div>
                                        <asp:Label ID="lblHolderDrop" runat="server" Text="There are no routes available"></asp:Label>
                                        <asp:GridView ID="gridDrop" runat="server" CssClass="routes-list"></asp:GridView> 
                                    </div>
                                </div>
                                </div>
                            <input class="primary-bt" type="button" value="Click to Proceed " />

                        </div>
                    </div>


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

Есть ли способ удерживать всплывающее окно, не закрывая его при нажатии кнопки.

Заранее спасибо Sangeetha

Answer 1

Попробуйте следующий код:

$('element_to_pop_up').bPopup({
    easing: 'easeOutBack', //uses jQuery easing plugin
    speed: 450,
    transition: 'slideDown'
});

Answer 2

Вы можете добиться этого, используя следующие параметры

• Поместите модальный контент в UpdatePanel
• Зарегистрируйте клиентский скрипт в событии нажатия кнопки, чтобы снова открыть модальное всплывающее окно.

Answer 3

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

На родительской странице

 <div class="modal-body">
 <iframe style="width: 710px; height: 450px;" id="ifrmChild" src="NewPage.aspx" runat="server" scrolling="yes"></iframe>
 </div>

На дочерней странице вы можете иметь сетки с кнопочным управлением. Это обычная страница aspx. Но при закрытии и открытии всплывающего окна вы должны использовать parent.FUNCTIONNAME() позвоните в дочернюю страницу, вот и все.