如何在 JSF 上延迟 Primefaces AjaxStatus？

Posted 2023-02-22

【中文标题】如何在 JSF 上延迟 Primefaces AjaxStatus？

【英文标题】：How to delay Primefaces AjaxStatus on JSF?

【发布时间】：2016-10-13 11:17:18

【问题描述】：

如何在 Primefaces 的 AjaxStatus 显示时添加延迟（例如 300 毫秒）。现在，当有一个 Ajax 请求挂起时，它总是立即显示。这对于例如“onkeyUp”事件来说是很麻烦的，因为每次击键都会在瞬间打开加载对话框。

这是我的 AjaxStatus 加载指示器组件：

<p:ajaxStatus id="startAjax" onstart="PF('start').show();" oncomplete="PF('start').hide();" >
</p:ajaxStatus>

<p:dialog widgetVar="start" showHeader="false" resizable="false">
    <h:graphicImage value="#resource['/images/loading.gif']"></h:graphicImage>
</p:dialog>

【问题讨论】：

您可以使用 primefaces 扩展 <pe:timer> 并从定时器调用 ajaxStatus 或 onShow 属性在 <p:dialog> 中可用，从那里调用定时器，它不会做任何事情，只是等待然后控制将返回将显示对话框和 ajaxStatus。

@techipank，pe:timer 似乎已被弃用。我将 Primefaces Extensions 添加到 maven 依赖项和命名空间 xmlns:pe="primefaces.org/ui/extensions" 和 pe: 仅提供时间线和时间选择器组件。没有计时器。也许 也合适

使用您自己的 javascript 函数：onstart="myStart('start')" 并在 function myStart(pfo) 中使用 window.setTimeout() 调用 PF(pfo).show()

@holger 是对的。所有纯 JavaScript。与 ajax、jsf 或 PrimeFaces 无关

【参考方案1】：

你需要用一个函数来包装你的 PF('start').start() ，这个函数会延迟调用它。此外，onComplete 处理程序应检查您是否有待显示和取消它们的状态。这是为了避免ajax在状态显示之前完成的情况。

代码应该是这样的（未经测试）

<p:ajaxStatus id = "startAjax" onstart = "startHandler();" oncomplete = "endHandler();"/>
    <script>
        var ajaxInProgress;
        function startHandler() 
            ajaxInProgress = setTimeout(function () 
                if(ajaxInProgress)
                   PF('start').show();
                
            , 3000);
        
        function endHandler() 
            clearTimeout(ajaxInProgress);
            PF('start').hide();
            ajaxInProgress = null;
        
    </script>

【讨论】：

谢谢。我会试试这个，看看你的答案是否正确。

是的，它有效。 400 毫秒似乎是我的应用程序的最佳时间。

【参考方案2】：

我提交了PF 7.1 +的本土属性的PR。

https://github.com/primefaces/primefaces/pull/5138

感谢您的建议！