& # 39;回# 39;按钮上一个模态弹出(Ajax模态弹出扩展器)

本文关键字:模态 扩展器 Ajax 上一个 按钮 | 更新日期: 2023-09-27 17:53:29

我有一个按钮在我的默认。它会启动一个"条款和条件"模式弹出窗口(popup1)。然后,我有一个按钮在模态弹出窗口启动另一个模态弹出窗口(popup2)在顶部(我的条款和条件的第2页)。

我想添加一个返回按钮到modalpopup2关闭popup2,并显示modalpopup1,这样用户就有了'forward/back'选项从popup2。

我已经添加了'ButtonBack'并尝试…

protected void ButtonBack_Click(object sender, EventArgs e)
{
    Popup1.Show();
}

但是这只是重定向回我的default.aspx。关于如何用c#或javascript解决这个问题,有什么想法吗?

谢谢

& # 39;回# 39;按钮上一个模态弹出(Ajax模态弹出扩展器)

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <script type="text/javascript" language="javascript">
        function fn_Next() {
            $find(ModalPopupExtender1).hide();
            $find(ModalPopupExtender2).show();
        }
        function fn_Next1() {
            $find(ModalPopupExtender2).hide();
            $find(ModalPopupExtender3).show();
        }
        function fn_Back() {
            $find(ModalPopupExtender2).hide();
            $find(ModalPopupExtender1).show();
        }
        function fn_Back1() {
            $find(ModalPopupExtender3).hide();
            $find(ModalPopupExtender2).show();
        }
    </script>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">    
    <script type="text/javascript" language="javascript">
        var ModalPopupExtender1 = '<%= ModalPopupExtender1.ClientID %>';
        var ModalPopupExtender2 = '<%= ModalPopupExtender2.ClientID %>';
        var ModalPopupExtender3 = '<%= ModalPopupExtender3.ClientID %>';
    </script>
    <asp:Button ID="btnShowPopup" Text="Show Popup" runat="server" />
    <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="btnShowPopup"
        PopupControlID="panelPopup1" BackgroundCssClass="bkgPopup" OkControlID="btnNext" OnOkScript="fn_Next()">
    </asp:ModalPopupExtender>
    <asp:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="panelPopup2"
        PopupControlID="panelPopup2" BackgroundCssClass="bkgPopup" OkControlID="btnBack" OnOkScript="fn_Back()"
            CancelControlID="btnNext1" OnCancelScript="fn_Next1()">
    </asp:ModalPopupExtender>
    <asp:ModalPopupExtender ID="ModalPopupExtender3" runat="server" TargetControlID="panelPopup3"
        PopupControlID="panelPopup3" BackgroundCssClass="bkgPopup" OkControlID="btnBack1" OnOkScript="fn_Back1()">
    </asp:ModalPopupExtender>
    <asp:Panel ID="panelPopup1" runat="server" CssClass="panelPopup">
        <div>
            <table>
                <tr>
                    <td>Popup 1</td>
                </tr>
            </table>            
        </div>
        <div>
            <asp:Button ID="btnNext" runat="server" Text="Next" />
        </div>        
    </asp:Panel>
    <asp:Panel ID="panelPopup2" runat="server" CssClass="panelPopup">
        <div>
            <table>
                <tr>
                    <td>Popup 2</td>
                </tr>
            </table>            
        </div>
        <div>
            <asp:Button ID="btnBack" runat="server" Text="Back" />
            <asp:Button ID="btnNext1" runat="server" Text="Next" />
        </div>        
    </asp:Panel>
    <asp:Panel ID="panelPopup3" runat="server" CssClass="panelPopup">
        <div>
            <table>
                <tr>
                    <td>Popup 3</td>
                </tr>
            </table>            
        </div>
        <div>
            <asp:Button ID="btnBack1" runat="server" Text="Back" />
        </div>        
    </asp:Panel>
</asp:Content>

谢谢你的帮助!

这是我最后的脚本…

    <script type="text/javascript" language="javascript">
    function fn_Next(sender, args) {
        $find('ModalTerms1').hide();
        $find('ModalTerms2').show();
    }
    function fn_Back(sender, args) {
        $find('ModalTerms2').hide();
        $find('ModalTerms1').show();

}

    function fn_Last(sender, args) {
        $find('ModalTerms3').hide();
        $find('ModalTerms1').hide();
        $find('ModalTerms2').show();
    } 
</script>