logo标签列表

模态弹出窗口扩展在显示后自动关闭。

c#asp.netajaxajaxcontroltoolkit
3
我正在使用AjaxToolkit中的ModalPopupExtender来进行asp.net开发。我试图使用不同的按钮触发ModalPopupExtender。问题在于，除非我使用TargetControlID，否则弹出窗口会在不到一秒钟的时间内打开并迅速关闭。我需要这个弹出窗口可以被多个不同的按钮访问，同时每次都使用相同的面板。
下面的代码应该可以很好地复制这个问题，在我的实际应用程序中它几乎可以正常工作。即使内容使用了所选的弹出窗口面板进行更新，但当我从OnClientClick调用.show()时，它也会在大约半秒钟后关闭。
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<script language="javascript" type="text/javascript">
    //Function to Hide ModalPopUp
    function Hidepopup() {
        $find('AjaxPopupHi').hide();
    }
    //Function to Show ModalPopUp
    function Showpopup() {
        $find('AjaxPopupHi').show();
    }

</script>

</head>

<form id="form1" runat="server">

<asp:LinkButton ID="lnk" OnClientClick = "Showpopup()" runat="server" Text="hi"></asp:LinkButton>


<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<br />

<asp:Button ID="Button_dummy" Style="display: none" runat="server" Text="Button" />

<ajaxToolKit:ModalPopupExtender ID="mpe" runat="server" BehaviorID="AjaxPopupHi" TargetControlID="Button_dummy" PopupControlID="pnl"
    CancelControlID="close" />

<!--BELOW panel does not remain OPEN :/-->
<asp:Panel ID="pnl" runat="server" CssClass="popupPanel">
    <div>
        Hi!!!
    </div>
    <asp:Button ID="close" runat="server" Text="Close" />
</asp:Panel>


 </form>

谢谢

2个回答
7
您可以像这样使用
OnClientClick = "return Showpopup()"


function Showpopup() {
    $find('AjaxPopupHi').show();
    return false;
}

你必须在你的代码中结合OnClientClick使用return。
<asp:LinkButton ID="lnk" OnClientClick = "return Showpopup()" runat="server" Text="hi">  
</asp:LinkButton>

你的 JavaScript 函数应该像这样：
function Showpopup() {
    $find('AjaxPopupHi').show();
    return false;
}
2
希望这篇文章能够帮助正在寻找答案的人，虽然现在已经很晚了。当你点击时，会发生回发并重新加载页面。如果你使用updatepanel，那么弹出窗口消息将会在页面加载后保留。请参考以下示例：

Aspx：

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Popup.aspx.cs" Inherits="Popup_example_Popup" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">

        //Function to Hide ModalPopUp
        function Hidepopup() {
            $find('AjaxPopupHi').hide();
        }
        //Function to Show ModalPopUp
        function Showpopup() {
            $find('AjaxPopupHi').show();
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

        <asp:UpdatePanel ID="udpOutterUpdatePanel" runat="server">
            <ContentTemplate>

                <asp:LinkButton ID="lnk" OnClientClick="Showpopup()" runat="server" Text="hi"></asp:LinkButton>

            </ContentTemplate>
        </asp:UpdatePanel>

        <br />

        <asp:Button ID="Button_dummy" Style="display: none" runat="server" Text="Button" />
        <ajaxToolkit:ModalPopupExtender ID="mpe" runat="server" BehaviorID="AjaxPopupHi" TargetControlID="Button_dummy" PopupControlID="pnl"
            CancelControlID="close" />

        <asp:Panel ID="pnl" runat="server" CssClass="popupPanel">
            <div>
                Hi!!!
            </div>

            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>

                    <asp:Button ID="close" runat="server" Text="Close" OnClick="close_Click" />

                </ContentTemplate>
            </asp:UpdatePanel>
        </asp:Panel>


    </form>
</body>
</html>

后台代码：

using System;

public partial class Popup_example_Popup : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void close_Click(object sender, EventArgs e)
    {
        mpe.Hide();
    }
}
花了好几个小时尝试让带有<audio>标签的弹出窗口在显示时自动播放...这终于解决了。我的按钮周围的UpdatePanel调用显示弹出窗口，我从未想过这一点。谢谢！ - Taylor Brown
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接