每场演出后ModalPopupExtender的z-index值减小 [英] ModalPopupExtender z-index value decreases after every show

查看:203
本文介绍了每场演出后ModalPopupExtender的z-index值减小的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是一个新的我从来没有见过的。我有一个包含了一堆,可通过点击GridView控件中的相应编辑链接上进行编辑类别的GridView控件。该modalpopupextender然后编程(.show()方法)中所示,用户可以编辑的类别。然后,模式弹出是programmtically隐藏(.hide()方法),当用户presses更新或取消。对于后模式弹出的每一个新节目某种原因,Z-指数由1000下降,直到它被隐藏在我的网页上的所有内容后面。它开始于7000的第一个节目。因此,用户将不能够,如果他们想编辑类别的无限数量。任何想法,为什么发生这种情况?

在modalpopupextender使用CSS类:

  DIV.box流行
{
    边框:#95aab9 1px的固体;
    背景颜色:#ECF1F5;
    显示:块;
    位置:相对;
    保证金:-6px 6像素6像素-6px;
    填充:4PX;
    的z-index:10000;
}

用于弹出面板:

 < ASP:面板ID =PanelModify=服务器WIDTH =250像素的CssClass =图框弹出>
    < ASP:的UpdatePanel ID =UpdatePanelModify=服务器的UpdateMode =条件>
        <&的ContentTemplate GT;
            <表格的宽度=100%的cellpadding =3CELLSPACING =3>
                &所述; TR>
                    &所述; TD>
                        < D​​IV CLASS =盒子>
                            < H1>
                                <跨度><强>
                                    < ASP:文字ID =LiteralModalTitle=服务器/>< / STRONG>< / SPAN>
                            < / H1>
                            <表格边框=0WIDTH =100%>
                                &所述; TR>
                                    &所述; TD>
                                        < ASP:文本框ID =TextBoxModifiedText=服务器WIDTH =173px的ValidationGroup =修改>< / ASP:文本框>
                                        < ASP:的RequiredFieldValidator ID =RequiredFieldValidatorModifiedText=服务器
                                            的ValidationGroup =修改的ErrorMessage =*的ControlToValidate =TextBoxModifiedText
                                            显示=动态>
                                        < / ASP:&的RequiredFieldValidator GT;
                                    < / TD>
                                < / TR>
                                &所述; TR>
                                    &所述; TD>
                                        < ASP:按钮的ID =ButtonUpdate=服务器文本=更新的ValidationGroup =修改/>< ASP:按钮
                                            ID =ButtonInsert=服务器文本=插入的ValidationGroup =修改/>
                                        &安培; NBSP;
                                        < ASP:按钮的ID =ButtonCancel=服务器文本=取消的CausesValidation =FALSE/>
                                    < / TD>
                                < / TR>
                            < /表>
                        < / DIV>
                    < / TD>
                < / TR>
            < /表>
        < /&的ContentTemplate GT;
    < / ASP:的UpdatePanel>
< / ASP:面板>
< ajaxToolkit:ModalPopupExtender ID =ModalPopupExtenderModify=服务器PopupControlID =PanelModify
    的TargetControlID =ButtonHideModifyBackgroundCssClass =modalBackground>
< / ajaxToolkit:ModalPopupExtender>
< ASP:按钮的ID =ButtonHideModify=服务器风格=显示:无; />


解决方案

发现问题。我使用弹出的面板里面装的是另一个更新面板。我把它更新面板之外和z-index的不再改变。

This is a new one I have never seen before. I have a gridview containing a bunch of categories that can be edited by clicking on the respective "Edit" link within the gridview. The modalpopupextender is then shown programmatically (.show() method) and the user is allowed to edit the category. Then the modal popup is programmtically hidden (.hide() method) when the user presses "Update" or "Cancel". For some reason after every new show of the modal popup, the z-index is decreasing by 1000 until it is hidden behind everything on my page. It starts at 7000 for the very first show. Therefore the user would not be able to edit an infinite number of categories if they wanted to. Any ideas why this is happening?

Css class used on modalpopupextender:

DIV.box-pop
{
    border: #95aab9 1px solid;
    background-color: #ECF1F5;
    display: block;
    position: relative;
    margin: -6px 6px 6px -6px;
    padding: 4px;
    z-index: 10000;
}

Panel used for popup:

<asp:Panel ID="PanelModify" runat="server" Width="250px" CssClass="box-pop">
    <asp:UpdatePanel ID="UpdatePanelModify" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <table width="100%" cellpadding="3" cellspacing="3">
                <tr>
                    <td>
                        <div class="box">
                            <h1>
                                <span><strong>
                                    <asp:Literal ID="LiteralModalTitle" runat="server" /></strong></span>
                            </h1>
                            <table border="0" width="100%">
                                <tr>
                                    <td>
                                        <asp:TextBox ID="TextBoxModifiedText" runat="server" Width="173px" ValidationGroup="Modify"></asp:TextBox>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidatorModifiedText" runat="server"
                                            ValidationGroup="Modify" ErrorMessage="*" ControlToValidate="TextBoxModifiedText"
                                            Display="Dynamic">
                                        </asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <asp:Button ID="ButtonUpdate" runat="server" Text="Update" ValidationGroup="Modify" /><asp:Button
                                            ID="ButtonInsert" runat="server" Text="Insert" ValidationGroup="Modify" />
                                        &nbsp;
                                        <asp:Button ID="ButtonCancel" runat="server" Text="Cancel" CausesValidation="false" />
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </td>
                </tr>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtenderModify" runat="server" PopupControlID="PanelModify"
    TargetControlID="ButtonHideModify" BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Button ID="ButtonHideModify" runat="server" Style="display: none;" />

解决方案

Found the problem. The panel I was using for the pop-up was inside another update panel. I moved it outside of the update panel and the z-index is no longer changing.

这篇关于每场演出后ModalPopupExtender的z-index值减小的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆