0

我有一个 ajax modalpopupextender,它会在发生错误时打开一个弹出窗口。这在我迄今为止测试过的所有浏览器中都可以正常工作。但不是在 Internet Explorer 7 中(它在 ie 8 和 9 中)

基本上没有应用面板的高度。在屏幕上它大约 20 像素高。我不知道为什么,并且已经使用了几个小时的各种样本无济于事。宽度 os 工作正常。任何帮助感谢达摩

HTML

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="myapp.Logon" %>

<!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">
    <link href="assets/css/Logon.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/modalBackground.css" rel="stylesheet" type="text/css" />
    <title>myapp Login</title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel" runat="server">
        <ContentTemplate>
            <ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtenderError" runat="server"
                TargetControlID="PanelLogonDetails">
            </ajaxToolkit:RoundedCornersExtender>
            <asp:Panel ID="PanelLogonDetails" runat="server" Width="350" Height="300" BorderColor="White" BackColor="White">
                <div id="container">
                    <asp:Label ID="LabelLogo" runat="server" Text="Logo"></asp:Label>
                    <br />
                    <div id="inputcontainer">
                        <asp:Label ID="lblUsername" runat="server" Text="Username"></asp:Label>
                        <br />
                        <asp:TextBox CssClass="Textbox" ID="txtUserName" runat="server" Text="Administrator"
                            ToolTip="Username" Width="200px"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidatorUsername" runat="server" ErrorMessage="You must enter a Username"
                            ControlToValidate="txtUserName" ForeColor="White"></asp:RequiredFieldValidator>
                        <br />
                        <asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
                        <br />
                        <!-- TextMode set to singleline for testing - set to Password for production-->
                        <asp:TextBox CssClass="Textbox" ID="txtPassword" runat="server" Text="!password£$nmj5%$-12"
                            ToolTip="Password" TextMode="SingleLine" Width="200px"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="RequiredFieldValidatorPassword" runat="server" ErrorMessage="You must enter a password"
                            ControlToValidate="txtPassword" ForeColor="White"></asp:RequiredFieldValidator>
                        <br />
                        <br />
                        <asp:Button CssClass="Button" ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click" />
                        <br />
                        <br />
                    </div>
                </div>
            </asp:Panel>
            <!-- Error Modal Form -->
            <asp:HiddenField ID="hideForModal" runat="server" />
            <ajaxToolkit:ModalPopupExtender runat="server" ID="ErrorModal" BehaviorID="modalPopupExtenderError"
                TargetControlID="hideForModal" PopupDragHandleControlID="popUpPaneError" PopupControlID="popUpPaneError"
                OkControlID="btnOk" BackgroundCssClass="modalBackground" DropShadow="False" Drag="true">
            </ajaxToolkit:ModalPopupExtender>
            <ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender1" runat="server" TargetControlID="popUpPaneError">
            </ajaxToolkit:RoundedCornersExtender>
            <asp:Panel ID="popUpPaneError" runat="server" CssClass="confirm-dialog" Width="485" Height="285" BackColor="White">
                <div id="ErrorInputContainer">
                    <div>
                        <b>Error Code:</b></div>
                    <asp:Label ID="lblErrorCode" runat="server" Text="Error Code"></asp:Label>
                    <div>
                        <b>Error Message:</b></div>
                    <asp:Label ID="lblErrorMessage" runat="server" Text="Error Message"></asp:Label>
                    <div>
                        <b>Ex message:</b></div>
                    <asp:Label ID="lblExMessage" runat="server" Text="Ex Message"></asp:Label>
                    <br />
                    <asp:Button ID="btnOk" runat="server" Text="Ok" CssClass="Button" />
                    <br />
                    <asp:LinkButton ID="LinkButton1" runat="server" CssClass="close" OnClientClick="$find('modalPopupExtenderError').hide(); return false;" />
                </div>
            </asp:Panel>
            <!-- End Error Modal Form -->
        </ContentTemplate>
    </asp:UpdatePanel>
    </form>
</body>
</html>

登录.css

#PanelLogonDetails
{


  background-color:#FFFFFF;  
  width: 350px;
  height: 300px;
  position:absolute;
  left: 40%;
  top: 40%;
  margin-left: -50px;
  margin-top: -50px;

}

/* main div */

#container
{

    padding-left:50px;
    padding-top:20px; 
}

#LabelLogo
{

    font-family: Arial, Sans-Serif;  
    font-size: 20px;  
    font-weight: bold; 

}

/* end main div */

/* inputcontainer (within the main div above) */

#inputcontainer {
  position:absolute;
  height:100px;
  width:230px;
  left: 35%;
  top: 50%;
  margin-left: -50px;
  margin-top: -50px;
}
/* End inputcntainer */






html,body {
    margin:0px;
    padding:0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size:13px;
    line-height:1.5em;  
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003366', endColorstr='#FFFFFF'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#036), to(#FFF)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #036,  #FFF); /* for firefox 3.6+ */ 
    height: 100%;   

}

/* Error Modal */




#ErrorInputContainer 
{    

    background-color:White;
        background:white;
    position:absolute;
    height:260px;
    width:460px;
    top:20px;
    left:20px;
    color:Black;


}

#popUpPaneError
{


    height:260px;
    width:460px; 



}



/* End Error Modal */


/* TextBox */


.Textbox
{


    width:auto;
        padding:2px;
        color:Black;

        text-align:left;
         -moz-border-radius: 5px;
         -webkit-border-radius: 5px;
         -khtml-border-radius: 5px; 
          border-radius: 5px; 
              font-size: 10pt; 
    font-family: Arial; 
}

.Textbox:focus
{

 background-color:#FFCC33;


}






/* End TextBox */




/* Button */


.Button
{


         -moz-border-radius: 5px;
         -webkit-border-radius: 5px;
         -khtml-border-radius: 5px; 
          border-radius: 5px;           
          text-align:left;          
          padding-left:22px;       
          background-repeat: no-repeat;
          background-image: url(/assets/img/action.gif);
          background-position:3px 50%
}

.Button:hover
{
          background: #FFCC33;
          background-repeat: no-repeat;
          background-image: url(/assets/img/action.gif);
          background-position:3px 50%
}


/* End Button */

modalBackground.css

.modalBackground
{
      background-color:#696969;
      filter: alpha(opacity=60);
      opacity: 0.6;
}


.close { 
    DISPLAY: block;BACKGROUND: url(img/close.png) no-repeat 0px 0px; 
    LEFT: -5px;WIDTH: 26px;TEXT-INDENT: -1000em;POSITION: absolute; 
    TOP: -7px;HEIGHT: 26px; 
}   
.modalBackground {
    background-color:Gray;filter:alpha(opacity=70);opacity:0.7;
} 
4

1 回答 1

0

http://www.mindfiresolutions.com/Workaround-for-Modal-Popup-with-RoundedCornerExtender-issue-833.php

这就是解决方案。ajax controltoolkit 的错误....感谢 Damo

于 2012-10-20T12:42:46.297 回答