17 April 2013

Let's Make A ModalPopUp

Are you wondering how to make a ModalPopUp work in your web application:

I have a simple application that works fine in my small project. Here's my code:


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

<style type="text/css">
        .modalBackground
        {
            background-color: Black;
            filter: alpha(opacity=90);
            opacity: 0.8;
        }
        .modalPopup
        {
            background-color: #FFFFFF;
            border-width: 3px;
            border-style: solid;
            border-color: black;
            padding-top: 10px;
            padding-left: 10px;
        }
    </style>


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


<cc1:ModalPopupExtender BackgroundCssClass="modalBackground"
                                        DropShadow="true" OkControlID="btnOk" CancelControlID="btnClose" runat="server"
                                        PopupControlID="Panel1" ID="ModalPopupExtender1" TargetControlID="appointmentDetailsbtn" />


 <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" BackColor="#ffffff" align="center"
        Style="display: none; ">
.
.
.
.

 <asp:Button ID="btnCancel" runat="server" Text="OK" />

</asp:Panel>

No comments:

Post a Comment