ModalPopup
My ModalPopup does not work. I see the text and the buttons on top of a black background. I don’t know why I am not getting the nice looking modalpopup window.
Login.aspx
<%@ Page Language="C#" MasterPageFile="~/PopUpForm.master" AutoEventWireup="true" CodeFile="Login.aspx.cs" Inherits="Login" Title="Untitled Page" %>
<%@ Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="PopUpFormContentPlaceHolder" Runat="Server">
<atlas:ScriptManager ID="ScriptManager1" runat="server"></atlas:ScriptManager>
<p><asp:LinkButton ID="LinkButton1" runat="server" Text="Click here to change the paragraph style"></asp:LinkButton></p>
<div style="display:none">
<asp:Panel ID="Panel1" runat="server" CssClass="modalPopup">
<p>Testing....</p>
<asp:Button ID="Button1" runat="server" Text="OK" />
<asp:Button ID="Button2" runat="server" Text="Cancel" />
</asp:Panel>
</div>
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server">
<cc1:ModalPopupProperties TargetControlID="LinkButton1" PopupControlID="Panel1" BackgroundCssClass="modalBackground" DropShadow="true" OkControlID="Button1" CancelControlID="Button2" />
</cc1:ModalPopupExtender>
</asp:Content>
PopupForm.master
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="PopUpForm.master.cs" Inherits="PopUpForm" %>
<!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>
<link href="App_Themes/BrownBeige/StyleSheet.css" rel="stylesheet" type="text/css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="App_Themes/BrownBeige/iewin-hacks.css" />
<![endif]-->
</head>
<body>
<form id="frmPopUpMaster" runat="server">
<div>
<asp:contentplaceholder id="PopUpFormContentPlaceHolder" runat="server" />
</div>
</form>
</body>
</html>
CSS
/*Modal Popup*/
.modalBackground {
background-color:Gray;
filter:alpha(opacity=70);
opacity:0.7;
}
.modalPopup {
background-color:#ffffdd;
border-width:3px;
border-style:solid;
border-color:#ffffff;
padding:3px;
}