通过asp.net中的第一个弹出页面执行第二次弹出

时间:2014-03-26 05:44:22

标签: c# javascript jquery asp.net popup

我计划在asp.net页面中实现两个pop。当页面按钮单击时,第一个弹出窗口执行,第一个弹出按钮单击时执行第二个弹出窗口。

但是当我在代码中实现它时,我只能弹出拳头。无法打开第二个弹出窗口。

enter image description here

ASPX代码 -

<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        .Background
        {
            background-color: Black;
            filter: alpha(opacity=90);
            opacity: 0.8;
        }
        .Popup
        {
            background-color: #FFFFFF;
            border-width: 3px;
            border-style: solid;
            border-color: black;
            padding-top: 10px;
            padding-left: 10px;
            width: 400px;
            height: 350px;
        }
        .lbl
        {
            font-size: 16px;
            font-style: italic;
            font-weight: bold;
        }
    </style>
    <script type="text/javascript">
        function ShowModalPopup() {
            $find("mp1").show();
            return false;
        }
        function HideModalPopup() {
            // alert("Yes");
            $find("mp1").hide();
            return false;
        }
        function ShowModalPopup1() {
            $find("ModalPopupExtender1").show();
            return false;
        }
        function HideModalPopup1() {
            // alert("Yes");
            $find("ModalPopupExtender1").hide();
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:Button ID="btnPopup1" runat="server" Text="Fill Form in Popup" />
    <!-- ModalPopupExtender -->
    <cc1:ModalPopupExtender ID="mp1" runat="server" PopupControlID="Panl1" TargetControlID="btnPopup1"
        BehaviorID="modalPopupBehavior" CancelControlID="btnHide" BackgroundCssClass="Background">
    </cc1:ModalPopupExtender>
    <asp:Panel ID="Panl1" runat="server" CssClass="Popup" align="center" Style="display: none">
        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:TextBox ID="txt" runat="server" />
                <asp:Label ID="Label2" Text="RED" runat="server" ForeColor="red" />
                <asp:Button ID="Button2" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
                <asp:CheckBox ID="CheckBox1" TextAlign="Left" Text="ssdd" runat="server" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnPopup1" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
        <asp:Button ID="btnHide" runat="server" Text="Hide Modal Popup" OnClientClick="return HideModalPopup()" />

                <!-- ModalPopupExtender 2 -->
                <asp:Button ID="btnPopup2" runat="server" Text="Fill Form in Popup" />
                <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupControlID="Panel1"
                    TargetControlID="btnPopup2" BehaviorID="modalPopupBehavior" CancelControlID="btnHide1"
                    BackgroundCssClass="Background">
                </cc1:ModalPopupExtender>
                <asp:Panel ID="Panel1" runat="server" CssClass="Popup" align="center" Style="display: none">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                        <ContentTemplate>
                            <asp:TextBox ID="TextBox1" runat="server" />
                            <asp:Label ID="Label1" Text="Blue" runat="server" ForeColor="Blue" />
                            <asp:Button ID="Button4" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
                            <asp:CheckBox ID="CheckBox2" TextAlign="Left" Text="ssdd" runat="server" />
                        </ContentTemplate>
                        <Triggers>
                            <asp:AsyncPostBackTrigger ControlID="btnPopup2" EventName="Click" />
                        </Triggers>
                    </asp:UpdatePanel>
                    <asp:Button ID="btnHide1" runat="server" Text="Hide Modal Popup" OnClientClick="return HideModalPopup1()" />
                </asp:Panel>
                <!-- ModalPopupExtender 2 -->
    </asp:Panel>
    <!-- ModalPopupExtender -->
    </form>
</body>

C#代码 -

protected void btnSubmit_Click(object sender, EventArgs e)
{
    Label2.Text = "Blue";
}

protected void btnClose_Click(object sender, EventArgs e)
{

}

2 个答案:

答案 0 :(得分:2)

此链接可能对您有用。

http://aspdotnetcodebook.blogspot.com.au/2009/03/how-to-open-modalpopup-inside.html

另外要在另一个模态弹出窗口中弹出一个模态,你需要设置z-index,否则第二个弹出窗口可能会隐藏在第一个弹出窗口后面。以下是解释相同的链接。

How to show a modal pop up above other modal pop up http://blogs.msdn.com/b/codejunkie/archive/2009/06/23/multiple-modal-popups-and-z-index.aspx http://tiredblogger.wordpress.com/2008/07/24/layering-modal-popups-using-css-z-index/ http://forums.asp.net/p/1280547/2458840.aspx#2458840

希望这有帮助。

答案 1 :(得分:1)