Откройте страницу aspx как модальное всплывающее окно

У меня есть сетка с опцией редактирования, и при нажатии кнопки редактирования мне нужно перенаправить на страницу редактирования. Требуется, чтобы эта страница редактирования отображалась как всплывающее окно с затененным фоном (предыдущая страница).

Я попробовал модальное всплывающее окно, но элементы управления находятся на отдельной странице.

Я попробовал модальное всплывающее окно с панелью и Iframe: это работает.. но тогда возникает другая проблема. Мне нужно закрыть страницу с помощью кнопки "СОХРАНИТЬ" или "Отмена". Однако эти элементы управления будут на странице редактирования, а не на предыдущей. страница. любая помощь приветствуется.

Спасибо раджат

Источник

5 ответов

Решение

Мы можем открыть aspx как всплывающее окно, используя IFrame следующим образом:

Сначала возьмите кнопку и предоставьте событие onclick следующим образом

   <input id="btnSymbol" type="button" value="..." onclick="OpenMyPopUp()" runat="server"/>

Далее На странице укажите тег "Div" с идентификатором следующим образом

   <div id="MyDialog">
        </div>

Затем найдите два метода, которые берут текущий URL и открывают страницу aspx во всплывающем окне, используя IFRAME.

    function OpenMyPopUp(){openPopup('OpenPage.aspx', 530, 800, 'Page Title');}

Четыре параметра отправляются следующим образом: URL, высота, ширина, заголовок

   function openPopup(url, h, w, t) {
if (url != null && h != null && w != null && t != null) {

    urlBase = location.href.substring(0, location.href.lastIndexOf("/") + 1);
    url = urlBase + url;
    $('#MyDialog').html('<iframe border=0 width="100%" height ="100%" src="' + url + '"> </iframe>');
    $("#MyDialog").dialog({
        title: t,
        modal: true,
        autoOpen: true,
        height: h,
        width: w,
        resizable: false,
        position: ['right-10', 'top+30'],
        closeOnEscape: false,
        dialogClass: "alert"
    });
}}
Источник

Я настоятельно рекомендую использовать пользовательский контроль, так как вам будет удобнее управлять, и нет смысла создавать целую страницу для него. Модальное всплывающее окно bcz использует запрос ajax, и если вы попытаетесь загрузить страницу в нем, то у вас есть сделать форму сообщения... что не идет ни с помощью ajax-запроса, ни с помощью формы сообщения назад...

Кроме того, я искал ответ на ваш вопрос, и я наткнулся на эту статью, где говорится:

Вы можете использовать Modal Popup Extender, чтобы открыть некоторую часть страницы как Popup. Но там у нас нет никаких свойств, чтобы открыть другую html или aspx страницу во всплывающем окне.

http://wiki.asp.net/page.aspx/1378/open-different-page-using-ajax-modal-popup-extender-control/

а также нашел людей, задающих тот же вопрос, что и вы, и ответ, который они получили здесь

использовать Iframe или пользовательский элемент управления

Есть ли способ открыть другую страницу, используя ModalPopup Extender?

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

надеюсь, это поможет...

Источник

Я несколько раз успешно пользовался Modal Popup Control из набора AJAX Control Toolkit: http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/ModalPopup/ModalPopup.aspx

Источник

Если вы используете загрузчик модальный, то вы можете добавить iframe в модальное тело и загрузить в него URL своей страницы.

<div class="modal fade" id="modalC" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">Cantidad reservas mensuales</h4>
            </div>
            <div class="modal-body" id="content">
                <iframe src="your new page url">
            </div>
        </div>
    </div>
</div>
Источник

Просто идея, но как насчет использования jquery "contents()" функция?

Вы можете установить интервал для поиска элемента в iframe с родительской страницы. (Вы используете.net, чтобы вы могли отобразить его после обратной передачи на странице iframe).

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="test.aspx.vb" Inherits="admin_test" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title></title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>    
    <script>
        $(function () {

            var watchForClose = setInterval(function () {
                if ($('#testIframe').contents().find('#closeModal').length > 0) {
                    clearInterval(watchForClose);
                    /* call function to close modal here..*/
                    alert('Close modal');
                };
            }, 100);

        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <iframe id="testIframe" src="Default.aspx" width="300" height="300"></iframe>
    </div>
    </form>
</body>
</html>

Выше ищется элемент внутри страницы iframe с идентификатором "closeModal". Когда этот элемент появляется, вы можете вызвать функцию закрытия модального окна (просто замените предупреждение на вызов).

Источник
Другие вопросы по тегам