加载用户控件在加载后弹出

时间:2012-08-31 00:59:51

标签: jquery asp.net user-controls popup modalpopupextender

我正在尝试在弹出窗口中加载用户控件但是在它被触发以减少主页加载时间后,是否可以使用Ajax ModalPopUp Extender或者是否有任何其他建议的弹出窗口。我可以使用框架而不是用户控件或相同吗?

2 个答案:

答案 0 :(得分:1)

由于你正在使用ASP.NET,一个简单的选择是使用jQuery UI和一个简单的div / iframe作为弹出窗口。

JavaScript:

<script type="text/javascript">
    function showPanel(panelID, pageUrl) {
        $panel = $('#' + panelID);

        $panel.html('<iframe src="' + pageUrl + '"></iframe>');
        $panel.dialog();
    }
</script>

ASPX:

<asp:LinkButton runat="server" id="lbtn1" OnClientClick="showPanel('dialog', '/myControlPage.aspx');return false;">
  Show Popup
</asp:LinkButton>
<div id="dialog">
</div>

如果您的ASPX控件是仅显示的,您可以使用AJAX来检索页面的内容:

<script type="text/javascript">
function showPanel(panelID, pageUrl) {
    $panel = $('#' + panelID);

    $.ajax({
        url: pageUrl,
        type: "GET",
        dataType: "html",
        async: false,
        data: {},
        success: function (obj) {
            $panel.html(obj).html();
            $panel.dialog();
        }
    });
}
</script>

但这限制了嵌入式页面“正确”回发的能力。任何回发都只会显示内页,并在从回发中返回时完全删除“父”页面。

答案 1 :(得分:0)

您可以使用updatePanel来实现此目的。

这是introduction to update panels

在更新面板中信封您的用户控件并将其设置为可见false。 将控件设置为可见false会确保不呈现它,因此不会影响您的加载时间。

然后,您可以在更新面板上使用Postback触发器使控件显示为true并显示其内容。

您可以在几毫秒后使用计时器作为负载的触发器。在回发时禁用计时器。这是tutorial on refreshing an update panel using a timer

更新面板上的回发是通过ajax触发的。所需的所有javascript都是由更新面板控件本身生成的。

使用它的好处是用户控件仍然在同一页面上,并且可以与页面上的其他控件进行交互。