0

我正在尝试使用 ModalPopupExtender 和动画 gif 来创建一种“处理...”窗口。

此页面可能需要一段时间来处理请求……目前无法加快速度。最终,我可以将其切换到在幕后数据库上运行的工作,并在完成后通过电子邮件发送给他们......但现在我只需要显示一个弹出模式处理窗口。

modalpopup 工作并显示我附加到它的面板......问题是按钮回发永远不会触发。这不是 AJAX 调用,而是完整的回发。通过使用 JavaScript 打开面板,我在其他页面上做了类似的事情,但在这个页面上我想使用模式面板,这样它们就不会弄乱任何控件。

这可能吗?

这是我的代码:

服务器端按钮处理程序:

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
'do stuff here
Dim str As String = ""
End Sub

客户端:

...
<asp:Button ID="Button1" runat="server" Text="Button" />
...
<asp:Panel ID="pnlProgress" runat="server" style="display:none">
<div class="borderPanel">Hello!!</div>
</asp:Panel>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="Button1" PopupControlID="pnlProgress" backgroundcssclass="ModalPopupBG" BehaviorID="modalpopup" >
</asp:ModalPopupExtender>
...

因此,当我单击 Button1 时,模式会显示,但回发从未命中服务器端方法。有任何想法吗?(顺便说一句,这些控件通常被命名,因为这只是一个测试。)

谢谢,乔治


这是我的新代码... HEAD 中的 JS 代码:

function ShowPopup() {
  $find('modalpopup').show();
  return true;
}

按钮,面板 MPE 代码:

<asp:Button ID="Button1" runat="server" Text="login" OnClientClick="ShowPopup();" OnClick="Button1_Click" />

<asp:ModalPopupExtender runat="server" ID="programmaticModalPopup" BehaviorID="modalpopup" TargetControlID="loginButton" PopupControlID="programmaticPopup" BackgroundCssClass="modalBackground" DropShadow="True" RepositionMode="RepositionOnWindowScroll"></asp:ModalPopupExtender>

<asp:Panel runat="server" CssClass="ModalPopupBG" ID="programmaticPopup" Style="background-color: #FFFFCC; display: none; height: 25px; width: 85px; padding: 10px">
    <div id='messagediv' style="text-align: center">
    Loading...</div>
</asp:Panel>

服务器端代码:

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
    'do stuff here
    Dim str As String = ""
End Sub
4

2 回答 2

0

您是否查看过 UpdateProgress 控件?你有什么特别的原因想要做 ModalPopup 吗?

编辑:您是否尝试过使用 Button 的OnClientClick属性?这将使您能够通过 JavaScript 显示模式弹出窗口,然后进入服务器端并运行您的耗时操作。

确保return true;使用您的 javascript 方法,以便完整的 PostBack 将触发到服务器。

于 2013-06-13T14:59:37.963 回答
0

您需要在按钮标签中添加点击事件(OnClick="Button1_Click")。

<asp:Button ID="Button1" runat="server" Text="Button"  OnClick="Button1_Click" />

您的问题是 ModalPopup 显示客户端。

您需要触发回发到服务器。

为 ModalPopup 添加一个虚拟目标

< asp:Button runat="server" ID="HiddenTargetControlForModalPopup" style="display:none" />

设置 TargetControlID="HiddenTargetControlForModalPopup"

在 Button1_Click 事件中调用 ModalPopupExtender1.show()。

Button1 现在将触发服务器端事件。

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style>
        .ModalPopupBG
        {
            background-color: #666699;
            filter: alpha(opacity=50);
            opacity: 0.7;
        }

        .HellowWorldPopup
        {
            min-width: 200px;
            min-height: 150px;
            background: white;
        }
        .hide
        {
            display: none;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:Button ID="Button1" runat="server" Text="click" />
        <asp:Button ID="Button2" runat="server" Text="Button" CssClass="hide" />
        <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" 
            TargetControlID="Button2" PopupControlID="Panel1" PopupDragHandleControlID="messagediv"
            Drag="true" BackgroundCssClass="ModalPopupBG">
        </cc1:ModalPopupExtender>

        <asp:Panel ID="Panel1" Style="display: none" runat="server">
            <div id='messagediv' style="text-align: center"  class="HellowWorldPopup">
                Loading...

            </div>
        </asp:Panel>
    </div>
    </form>
</body>
</html>

代码后面的页面

 Protected Sub Button1_Click(sender As Object, e As System.EventArgs) Handles Button1.Click
        ModalPopupExtender1.Show()

    End Sub

您可以使用隐藏 ModalPopup

ModalPopupExtender1.Hide() ;

我希望它会帮助你

于 2013-06-13T12:17:43.733 回答