【问题标题】:How to hide <p:messages> after it displayed the messages?显示消息后如何隐藏 <p:messages>?
【发布时间】:2013-10-09 12:15:15
【问题描述】:

我正在处理 primefaces 中的 JSF 应用程序,因为我通过 &lt;p:messages&gt; 向用户显示信息。

所以当用户点击提交时,页面将被处理并触发 p:messages 对话框向用户显示信息,

我推荐了 Primefaces p:messages 展示页面

它工作正常..但是在显示消息后,它不会自动关闭,要么我们需要手动关闭该对话框,要么它保持在打开阶段。

我需要它在向用户显示消息后自动关闭... 我该怎么做...有人可以建议我该怎么做吗?

【问题讨论】:

  • 你为什么不试试&lt;p:growl /&gt;
  • 是的..但是咆哮就像窗口上的复制层一样。但不同于&lt;P:messages&gt; 对..我认为&lt;p:messages&gt; 会很安静.. 那是你..
  • &lt;p:messages&gt; 在下一个更新它的 AJAX 请求中消失,假设没有任何其他消息要呈现。
  • @rdcrng..很好,所以我们没有next AJAX request 表示,它将保持显示正确。,我们如何通过给出任何强制事件来关闭该消息..

标签: jsf-2 primefaces


【解决方案1】:

&lt;p:messages id="msgs"&gt; 最终呈现为&lt;div id="msgs"&gt;,然后它的内容会更新为向用户发送的实际消息。

如果您想在延迟一段时间后清除消息屏幕,您应该在 ajax 调用完成后使用 JavaScript setTimeout 函数:

<p:commandButton ... 
        oncomplete="setTimeout(function() { $('#msgs").html(''); }, 3000);" />

setTimeout函数的第二个参数是以毫秒为单位的延迟。

另一种选择是改用&lt;p:growl&gt;

【讨论】:

  • @skuntsel.. 它不起作用,但 stackoverflow.com/questions/14210116/… 运行良好,这里 $('#msgs').html(''); 通过这段代码会发生什么
  • 除了我删除 HTML 内容而 Daniel/Partlov 决定使其不可见并且我的代码显式传递匿名函数而不是隐含包装成匿名的文字文本这一事实之外,它在哪些方面有所不同功能?顺便说一下,解决方案是在 PF 3.5 上测试的。
【解决方案2】:

&lt;p:fileUpload&gt; 工作,在&lt;p:dataList&gt;&lt;h:panelGrid&gt; 元素中。

    <p:fileUpload...
           oncomplete="setTimeout(function() { $('[id$=mr-upload-messages]').hide(1000); }, 2000);">

...
    <p:messages id="mr-upload-messages" showDetail="true" showSummary="false" closable="true"/>

我使用 jQuery $('[id$=mr-upload-messages]' 来查找以 mr-upload-messages 结尾的 id,因为 Primefaces 在 id 的开头添加了它的唯一标识符。

【讨论】:

    【解决方案3】:

    $('#msgs').html(''); 3 秒后立即隐藏,但如果您想像 jquery hide 方法那样慢慢隐藏,请执行此操作..

    <p:commandButton ... 
            oncomplete="setTimeout(function() { $('#msgs').hide(1000); }, 3000);" />
    

    hide(1000);隐藏动作将在1秒内完成

    【讨论】:

    • 伟大的 Mohsin,这可以很好地隐藏消息。我需要隐藏弹出窗口并在 3 秒内隐藏消息,所以在这种情况下,只有第一种方法(隐藏弹出窗口)起作用,这很奇怪!
    【解决方案4】:

    我遇到了关注,并这样做了:

    function hideMsg(){
    $("#msg").delay(1000).hide(1000);
    }
    
    oncomplete="hideMsg()"
    

    【讨论】:

    • 请在此处使用英文。 使用英语嵌套网站
    猜你喜欢
    • 2019-01-11
    • 2018-07-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-05-24
    • 2016-02-03
    • 1970-01-01
    • 2013-06-23
    相关资源
    最近更新 更多