I have a panel and a modalpopupextender on my page. Everything is very simple and exactly like the examples I've seen. The problem is that if I set the display attribute of the panel to "none" - as all the examples show - the panel isn't visible when it's popped up. The main page greys out and is inactive but I can't see the popup panel. If I remove the "display: none" from the panel stylesheet then everything works perfectly except that the panel is briefly visible when the page first renders. It instantly disappears but causes the page to flicker.
I'm not using a master page and I have ajax toolkit 1.0.10301.1
Any ideas?
Could you post a small, self-sufficient repro that demonstrates your problem? It seems like it should just work from what you are describing.Here is the stylesheet
.ReImportPanel{/*visibility:<span class='val'> hidden</span>;*/ font-size:small; border-width:medium; border-color:#3C6B34; border-style:solid; border-width:medium; width:500px; background-color: #ebebdf;}.modalBackground{ background-color:Silver; filter:alpha(opacity=70); opacity:0.7;}Here is the page
<%@. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <link href="StyleSheet.css" rel="stylesheet" type="text/css" /></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" Y=100 DropShadow="true" PopupControlID="pnlReimport" OkControlID="btnClosePopup" CancelControlID="btnClosePopup" BackgroundCssClass="modalBackground" TargetControlID="Button1"> </cc1:ModalPopupExtender> <asp:Panel ID="pnlReimport" runat="server" CssClass="ReImportPanel" Width="500px" HorizontalAlign="Center"> <h3> Popup Dialog</h3> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <br /> <br /> <asp:Button ID="btnClosePopup" runat="server" Text="Close" /> </asp:Panel> <asp:Button ID="Button1" runat="server" CausesValidation="False" Text="Show Popup" /> </div> </form> </body></html>
Here is the stylesheet
.ReImportPanel{/*visibility:hidden*/ font-size:small; border-width:medium; border-color:#3C6B34; border-style:solid; border-width:medium; width:500px; background-color: #ebebdf;}.modalBackground{ background-color:Silver; filter:alpha(opacity=70); opacity:0.7;}Here is the page
<%@. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title> <link href="StyleSheet.css" rel="stylesheet" type="text/css" /></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" Y=100 DropShadow="true" PopupControlID="pnlReimport" OkControlID="btnClosePopup" CancelControlID="btnClosePopup" BackgroundCssClass="modalBackground" TargetControlID="Button1"> </cc1:ModalPopupExtender> <asp:Panel ID="pnlReimport" runat="server" CssClass="ReImportPanel" Width="500px" HorizontalAlign="Center"> <h3> Popup Dialog</h3> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor <br /> <br /> <asp:Button ID="btnClosePopup" runat="server" Text="Close" /> </asp:Panel> <asp:Button ID="Button1" runat="server" CausesValidation="False" Text="Show Popup" /> </div> </form> </body></html>
No comments:
Post a Comment