在某些秒后隐藏p:消息

时间:2015-09-04 14:13:04

标签: jsf-2 primefaces

如何使用jsf primefaces在指定的秒数后隐藏消息(对于onedit和oncancel或单独使用);

<p:messages id="messages" showDetail="true" autoUpdate="true" closable="true" />
<p:dataTable id="platform" var="platform" value="#{platformMB.platformList}" editable="true">  
   <p:ajax event="rowEdit" listener="#{platformMB.onEdit}" 
           update=":formConfig:messages"/>
   <p:ajax event="rowEditCancel" listener="#{platformMB.onCancel}" 
           update=":formConfig:messages"/>  
.... 

1 个答案:

答案 0 :(得分:4)

您可以通过挂钩特殊的pfAjaxComplete事件,在完成PrimeFaces ajax请求时调用JS函数。

$(document).on("pfAjaxComplete", function() {
    // ...
});

您可以使用JS setTimeout()来安排在 n 毫秒之后调用的函数。

setTimeout(function() {
    // ...
}, 1000);

您可以使用jQuery $.hide()或更好的$.slideUp()来隐藏DOM元素。

$(element).slideUp();

你当然不想太快隐藏它们。让我们假设我们以3秒的最小超时开始作为人眼的“预热”时间,然后为消息中的每个单词计算200ms。

现在,让我们把它们放在一起:

$(document).on("pfAjaxComplete", function() {
    var $messages = $(".ui-messages div");

    if ($messages.length) {
        var wordCount = $messages.text().split(/\W/).length;
        var readingTimeMillis = 3000 + (wordCount * 200);

        setTimeout(function() {
            $messages.slideUp();
        }, readingTimeMillis);
    }
});