Question

让我说我的<p:dataTable>中有一些工具提示。当我更改dataTable的页面并且其他页面运行时，我会在任何工具提示上移动鼠标 - 它会显示，但在加载其他页面之后，工具提示永远不会消失..我已尝试更新此项，使用p:ajax，p:remoteCommand但没有任何帮助，实际上这又提出了另一个Ajax请求和工具提示。只有整页重新加载F5才有效。

有没有遇到过这样的问题？非常感谢你的帮助！

Answer 1

这看起来像是一个PrimeFaces错误，但您可以通过JS隐藏工作提示在分页事件上来解决它。

<p:dataTable value="#{bean.val}" var="row" rowIndexVar="rowIndex" rows="10" paginator="true">
    <p:ajax event="page" oncomplete="hideTooltips();" />

    <p:column>
        <h:outputText id="text" value="#{row}" />
        <!--
            since p:tooltip is located inside an iterative component (p:dataTable), we can't
            just define a static widgetVar value, because there will be a widget instance for
            each iteration, and each instance must have a unique widgetVar value, so we'll
            use rowIndex to achieve that
        -->
        <p:tooltip widgetVar="textTipVar#{rowIndex}" for="text" value="Tip" />
    </p:column>
</p:dataTable>
<script>
    function hideTooltips() {
        /*
            we've defined a bunch of widgetVars with a dynamic name, so we'll iterate over
            all widgets on the page and find the ones we need by looking for a known
            widgetVar prefix
        */
        for (var w in PrimeFaces.widgets) {
            if (w.indexOf('textTipVar') === 0) {
                PrimeFaces.widgets[w]._hide();
            }
        }
    }
</script>

这使用了未记录的工具提示窗口小部件方法_hide，在更新到另一个PrimeFaces版本时请记住这一点，例如方法的名称可能会改变。 PrimeFaces.widgets对象也没有记录。

Answer 2

如果其他人在努力解决这个问题，我想我找到了一个值得尝试的解决方案。在我的情况下，我有一个工具提示，显示当我在命令按钮上盘旋时，但如果我点击它，它将运行ajax请求并返回，更新组件并完成但工具提示仍将保留。这就是我所做的修复它。

<p:tooltip id="saveDeleteTooltip" globalSelector="[data-tooltip]" position="top" hideEvent="mouseleave click"/>

为hideEvent属性提供两个事件，似乎识别并使用它们。第一个是普通的鼠标输出，但是当我点击我的commandButtons时，它确实会触发，它确实隐藏了工具提示，就像它应该做的那样。

另一个Ajax请求后，Primefaces <p：tooltip>不会消失

2 个答案: