在 RichFaces 4.x 中移动弹出窗口后弹出阴影位置不正确答案

【问题标题】：Incorrect popup shadow position after moving popup in RichFaces 4.x在 RichFaces 4.x 中移动弹出窗口后弹出阴影位置不正确
【发布时间】：2013-11-03 09:53:17
【问题描述】：

我有一个带有 autosized 属性的弹出窗口。面板包含用于搜索、搜索按钮、数据表和数据滚动条的字段。按下搜索按钮或在 datascroller 中选择页面后调用 javascript。 Javascript 用于将弹出窗口移动到浏览器可见区域的中心。一切正常，除了弹出阴影在弹出窗口已移动时保留在先前的面板位置。

按钮代码：

<a4j:commandButton id="searchButton"
    value="#{msg.search}"
    action="#{chAction.searchSegments}"
    styleClass="richButton"
    render="clientCategoryCandidateTable"
    oncomplete="centerPanel();" />

Javascript：

function centerPanel() {
    var modalPanel = #{rich:component('addToSegmentsPanel')};
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupWidth = modalPanel.width();
    var popupHeight = modalPanel.height();
    modalPanel.setLeft(Math.max(0, (windowWidth-popupWidth)/2));
    modalPanel.setTop(Math.max(0, (windowHeight-popupHeight)/2));
};

我尝试了不同版本的 javascript，但副作用相同：

function centerPopup() {
    var popup = #{rich:component('addToSegmentsPanel')};
    popup.moveTo(Math.max(0, (window.innerWidth-popup.width())/2),
                 Math.max(0, (window.innerHeight-popup.height())/2));
};

屏幕截图：

感谢任何帮助或 cmets。

【问题讨论】：

标签： javascript jsf-2 richfaces

【解决方案1】：

我解决了调用弹出窗口的 resize() 动作的问题。在你的情况下，它应该是modalPanel.resize()。

【讨论】：

您的回答部分正确。您的方法适用于阴影，但它不允许更改弹出宽度。由于数据表中的结果数据不是以 1 行（预期结果）显示，而是以多行（名称、类型、描述）显示。我的版本不仅调整了窗口大小，而且调整了适当大小的数据表。
我尝试在数据表中使用多行。它正确调整大小。在数据表中，我没有在列中放置样式。
我有相反的情况：弹出窗口包含分页的数据表，数据表没有严格的列宽，在第一页我有短名称的行，在第二页有些行有长名称。在下一页单击centerPanel 后，将调用 javascript 并重新居中弹出窗口。在此之前，您的代码有效。但我想在 1 行中显示所有数据（如果需要，调整数据表的大小）。您的代码未涵盖此部分。数据显示为多行。也许可以通过为数据添加列宽或不换行来修复它。 5个月前问题已解决。感谢您的解决方案。

【解决方案2】：

通过在 javascript 末尾添加隐藏和显示解决了问题：

modalPanel.hide(); modalPanel.show();

【讨论】：