[英]Primefaces <p:tooltip> does not disappear after another Ajax request
Let's say I have some tooltips in my <p:dataTable>
. 假设我在<p:dataTable>
有一些工具提示。 When I change the page of dataTable
and while another page laods, I move mouse on any tooltip - it shows up, but after the other page is loaded tooltip never disappears.. I've tried to update this, using p:ajax
, p:remoteCommand
but nothing helps, actually this made another Ajax
request and tooltips also stucked. 当我改变页面dataTable
和而另一页laods,我任何提示移动鼠标-它显示出来,但之后的其他页面加载提示从来没有消失。我已经尝试更新此,使用p:ajax
, p:remoteCommand
但没有任何帮助,实际上这提出了另一个Ajax
请求,并且工具提示也卡住了。 Only full page reload F5
works. 仅整页重新加载F5
有效。
Has anyone encountered with such problem? 有没有人遇到过这样的问题? Thanks a lot for your help! 非常感谢你的帮助!
This looks like a PrimeFaces bug, but you can work around it by hiding tooltips on pagination events via JS. 这看起来像是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>
This uses an undocumented Tooltip widget method _hide
, keep that in mind when updating to another PrimeFaces version, eg the method's name could change. 这使用了未记录的Tooltip小部件方法_hide
,在更新到另一个PrimeFaces版本时请记住这一点,例如,方法的名称可能会更改。 The PrimeFaces.widgets
object is undocumented too. PrimeFaces.widgets
对象也未记录。
Incase anybody else struggles with this, I think I found a solution worth trying. 万一其他人对此感到挣扎,我想我找到了值得尝试的解决方案。 In my case, I had a tool tip that showed when I hovered over a commandButton but if I clicked it it would run an ajax request and return, update a component and finish but the tooltip would still remain. 以我为例,当我将鼠标悬停在commandButton上时,会显示一个工具提示,但是如果单击它,它将运行ajax请求并返回,更新组件并完成操作,但该工具提示仍将保留。 This is what I did to fix it. 这就是我所做的修复。
<p:tooltip id="saveDeleteTooltip" globalSelector="[data-tooltip]" position="top" hideEvent="mouseleave click"/>
Supply two events for the hideEvent attribute and seems to recognize and use both. 为hideEvent属性提供两个事件,似乎可以识别并使用这两个事件。 The first is for normal mouseout but the second does fire when I click on my commandButtons it does hide the tooltip like it was supposed to do. 第一个用于普通的鼠标移出,但是第二个在我单击commandButtons时触发,它确实像应该那样隐藏了工具提示。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.