Question

我需要在显示时在对话框中显示错误和警告消息。如果没有显示对话框，我需要在容器页面中显示消息

我在所有视图中都使用了facelets设置了一个模板：template="/WEB-INF/templates/template.xhtml"> 有了这个内容：

<f:view locale="#{loginBB.localeCode}">
    <p:messages autoUpdate="true" closable="true" id="globalMessages" />
    <ui:insert name="content" />
</f:view>

在所有对话框中，我有以下内容：

<p:messages autoUpdate="true" closable="true" id="dialogMessages" />

当对话框显示时，错误消息出现在对话框和保持它的视图中，但我需要它只出现在对话框中。

我做错了什么？我不知道该怎么做

编辑：根据BalusC的回答，我做了以下事情：

模板：

<f:view locale="#{loginBB.localeCode}">
    <ui:insert name="dialogs" />
    <p:messages autoUpdate="true" closable="true" redisplay="false" />
    <ui:insert name="content" />
</f:view>

查看：

<ui:define name="content">
    ...
</ui:define>

<ui:define name="dialogs">
    <h:form id="formX">
        <p:dialog ... >
        </p:dialog>
    </h:form>
</ui:define>

打开对话框时，它会在对话框中显示该消息。还行吧。但是当对话框关闭时，它不会在主页面中显示消息

Answer 1

如果两个<p:messages>组件都有autoUpdate="true"，则会变得棘手。如果仅自动更新页面<p:messages>，则可行。如果您可以确保在对话框的<p:messages>之后页面的<p:messages>出现在JSF组件树中，那么它就是设置的问题页面redisplay到<p:messages>的{{1}}属性，并确保每个对话框的操作都会更新对话框的自有形式{ {1}}。

false

不需要额外的JS。您可能只需要更改模板，使<p:messages> 高于页面<p:dialog> <h:form> <p:messages /> ... <p:commandButton ... update="@form" /> </h:form> </p:dialog> <p:messages autoUpdate="true" redisplay="false" />，以便所有对话框都在那里结束。或者，也可以使用CSS绝对定位页面<ui:define name="dialogs">。或者，也许，使用JS将页面<p:messages>重新定位到您希望在HTML DOM中使用它的位置。

Answer 2

我已经开发了，让我们说“讨厌”的方式。

page.xhtml

<p:dialog widgetVar="dialog" >
   <p:messages autoUpdate="true" />
</p:dialog>
<p:messages autoUpdate="true" />

page.js

$(document).ready(function() {
   /**
   * Hook onShow event
   */
   dialog.cfg.onShow = function onShowDialog() {
       $(".ui-messages").not('.ui-dialog .ui-messages').hide()
   }

   /**
   * Hook onHide event
   */
   dialog.cfg.onHide = function onHideDialog() {
       $(".ui-messages").not('.ui-dialog .ui-messages').show()
   }

})

或如果您想在所有对话框上应用此功能。

但是您不能为任何对话框定义任何widgetVar属性。

$(document).ready(function() {
   $('.ui-dialog').each(function() {
       widgetName = 'widget_' + $(this).attr('id').replace(/\:/g, '_');
       dialog = window[widgetName];

       dialog.cfg.onShow = function onShowDialog() {
           $(".ui-messages").not('.ui-dialog .ui-messages').hide()
       }

       dialog.cfg.onHide = function onHideDialog() {
           $(".ui-messages").not('.ui-dialog .ui-messages').show()
       }
   })
})

并且神奇地发生了。

注意：如果更新对话框，则会丢失事件，需要重新运行脚本。

demo

Answer 3

我认为在渲染整个页面时这是不可能的，因为每个<p:messages/>标记都会显示该消息。

但是您可以通过ajax更新对话框消息并仅渲染页面的那一部分，因此全局消息不会再次呈现。

不要重新显示已在<p：messages autoupdate =“true”> </p：messages>中的对话框中显示的消息

3 个答案: