Ajax ModalPopup在IE8中显示错误

Question

当我在IE8上使用modalPopup控件时，我遇到了问题。 需要popUp的面板已经加速了。

因为它看起来像（在比IE 8更新的浏览器中），连续有面板，当你点击其中一个时，会弹出一个窗口（使用AJAX modalPopUp）

在IE8中它显示了popUp窗口（面板），甚至没有点击列表中的一个面板。

以下是代码：

<asp:updatepanel id="UpdatePanel1" runat="server">
<contenttemplate>
<asp:panel id="PanelManufacturerPictures" runat="server" scrollbars="Auto" width="100%">
<asp:datalist id="DataListManufacturersPictures" runat="server" cellpadding="5" repeatdirection="Horizontal" repeatcolumns="11" showfooter="False" showheader="False" cellspacing="16">
<itemstyle height="75px" width="75px"/>
<itemtemplate>
    <asp:imagebutton id="ImageButtonManufacturerPicture" runat="server" alternatetext='<%# eval("manufacturername") %>' Height="100%" ImageUrl='<%# "~/elimansourwcf/manufacturerspictures/"+databinder.eval(container.dataitem, "imageurl") %>' ToolTip='<%# eval("manufacturername") %>' Width="100%" CausesValidation="False" /> <asp:roundedcornersextender id="RoundedCornersExtenderDetailsManufacturers" runat="server" targetcontrolid="PanelManufacturersDetails" radius="8" bordercolor="Red">
</asp:roundedcornersextender>
<asp:modalpopupextender id="ModalPopupExtenderManufacturerDetails" runat="server" popupcontrolid="PanelManufacturersDetails" targetcontrolid="ImageButtonManufacturerPicture" backgroundcssclass="modalBackgroundProducts" cancelcontrolid="ButtonManuCancel">
</asp:modalpopupextender>
<asp:panel id="PanelManufacturersDetails" runat="server" backcolor="White">
<div dir="rtl">
    <asp:label id="LabelManufacturerName" runat="server" font-bold="True" font-size="XX-Large"></asp:label>
    <div style="float: right;">
        <asp:table id="TableDetails" runat="server" cellpadding="15" font-bold="True" cellspacing="15">
        <asp:tablerow id="TableRow5" runat="server">
        <asp:tablecell id="TableCell8" runat="server" width="100px" horizontalalign="Left" columnspan="2">
        <asp:roundedcornersextender id="RoundedCornersExtenderDetailsManufacturerCancel" runat="server" targetcontrolid="ButtonManuCancel" radius="8">
        </asp:roundedcornersextender>
        <asp:button id="ButtonManuCancel" runat="server" text="צא מחלון זה" width="75px" causesvalidation="False" backcolor="Red" forecolor="White" font-bold="True"/>
        </asp:tablecell>
        </asp:tablerow>
        </asp:table>
    </div>
</div>
</asp:panel>
</itemtemplate>
</asp:datalist>
</asp:panel>
</contenttemplate>
</asp:updatepanel>

我看到了一个帖子：

  

Ajax ModalPopup wrong display in IE8 - IE9    但我不明白把css放在哪里“position：absolute;”

以下是该网站的网址：

www.emansour.co.il

感谢您的帮助

[编辑] 我注意到，当我在有界数据控件中使用modalPopup时会出现此问题。

Answer 1

您的错误是由RoundedCornersExtender之一引起的。出于某种原因，有时这些不能很好地嵌套在众多Panels控件和UpdatePanels中。通过删除为您的按钮设计样式的RoundedCornersExtender，我摆脱了这个问题。删除此RoundedCornersExtender控件，并在代码中添加以下css类，使您的按钮成为圆角：

.rounded
{
    color: white;
    background-color: red;
    font-weight: bold;
    width: 75px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border: 0px none;
}

然后将样式应用于按钮：

<asp:Button ID="ButtonManuCancel" runat="server" Text="צא מחלון זה" Width="75px" CausesValidation="False" BackColor="Red" ForeColor="White" Font-Bold="True" CssClass="rounded" />

我离开了另一个RoundedCornersExtender并在IE上测试并没有收到错误。 AjaxToolkit有时可能非常有用，但其他时候可能是一个真正的痛苦。如果你想添加像这样的简单功能（简单的css），我会建议不要使用ControlExtension来做这么简单的事情。我会使用Ajax.net控件来处理更复杂的东西，或者完全避免它。