AJAX ModalPopup 在页面内容后面（下方）弹出（负 z-index）

Question

我在 AJAX Control Toolkit (http:// ajaxcontroltoolkit.codeplex.com/releases/view/43475）。

ModalPopup 第一次可见时它可以正常工作。 z-index 设置为 6001（背景 Div 的 z-index 设置为 6000），并且 Popup 出现在其他所有内容之上。如果单击 ModalPopup 中的取消按钮，它也具有正确的功能，显示设置为“无”并且 ModalPopup 不再可见。

但是，当再次触发 Popup 时，z-index 仅设置为 2000，这仍然高于其他所有内容，但如果取消并再次触发，则设置为 -2000，这是不可见的（z-index 是每次减少4000）。

我不知道为什么会发生这种情况。有什么想法如何修复它吗？

特殊情况：

• 页面上有多个ModalPopup。
• 所有 ModalPopups 都通过部分页面回发（使用 .Show() 方法）在代码隐藏中触发（使用 .Show() 方法）
• ModalPopupExtender 位于显示为弹出窗口 UPDATE 的相同 UpdatePanel 内

： 这是项目团队确认的错误。 http://ajaxcontroltoolkit.codeplex.com/workitem/26739。现在已经修复了。

Answer 1

一种解决方法是按如下所示设置 ModalPopup 的 CSS；这将覆盖 AJAX 控制工具包应用于元素的内联 CSS。

.ModalPopup
{
    z-index: 6001 !important;
}
.ModalPopupBackground
{
    z-index: 6000 !important;
}

Answer 2

我刚刚遇到了这样的问题。这是我想出的一个快速修复方法，

<script type="text/javascript">
    onload = function() {
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(resetCounter);
    }
    function resetCounter(sender, args) {
        try {
            Sys.Extended.UI.ModalPopupBehavior._openCount = 0;
        } catch (ex) {
            // try-catch-throw away!
        }
    }
</script>

在 ExtendedModalPopup javascript 中，它在每个部分页面回发上调用 hide，这会执行 _openCount-- 操作。

这是基于 _opencount 设置 zindex 的代码：

var zindex = 10000 + (Sys.Extended.UI.ModalPopupBehavior._openCount++ * 1000);

因此 _openCount 设置为负数

Answer 3

这是项目团队确认的错误。 http://ajaxcontroltoolkit.codeplex.com/workitem/26739。现在已经修复了。

来自团队：我们已经确认这是初始版本 40412 中存在的错误。我们现在已替换为修复此问题的修改版本。请重新下载40412解决此问题

Answer 4

就我而言，模态弹出窗口前 10 次工作正常，但下一次出现在页面其他组件的后面。在 css 中设置 z-index 对我有用，谢谢！

.modalbackground {
    background-color: Gray;        
    filter: alpha(opacity=70);
    opacity: 0.7;
    z-index: 6000 !important;
    }    
.popup
    {        
    background-color:#FFF;
    padding:10px;     
    max-width:600px;
    z-index: 6001 !important;
    }

Answer 5

如果涉及更新面板，工具包的 15.1.4 版本中也会出现类似的问题。
https://ajaxcontroltoolkit.codeplex.com/workitem/27971
目前尚未修复，但 15.1.3 并未显示此问题。