简体   繁体   English

Primefaces组件类似于p:messages

[英]Primefaces component similar to p:messages

Primefaces 5 Primefaces 5

Are there component that shows data similar to p:messages component. 是否存在显示类似于p:messages组件的数据的组件。 Ie greyed / colored box with close button, but without warning sign. 即带有关闭按钮的灰色/彩色框,但没有警告标志。

在此处输入图片说明

Or how can you use Messages component to show any content as panel component. 或者如何使用“消息”组件将任何内容显示为面板组件。

EDIT : If Message panel should be shown for several updates, as far as I know you must use FacesContext to add a message for every update. 编辑 :如果应该显示几个更新的消息面板,据我所知,您必须使用FacesContext为每个更新添加一条消息。 I don't want to do it. 我不想做

EDIT2 : This is what I want to achieve. EDIT2 :这是我想要实现的。 At the best with a primefaces component. 最好使用primefaces组件。

在此处输入图片说明

As you can see: 如你看到的:

  1. any content 任何内容
  2. command link 命令链接
  3. close button 关闭按钮

Depends if you want it to be inline or kind of 'popup'. 取决于您希望它是内联的还是“弹出”类型。

If you want it to not always be visibile, I'd use an overlayPanel and with giving it a styleClass and some custom css it looks like what you want (styling done against default showcase theme): 如果您不希望它总是可见,则可以使用overlayPanel并为其提供一个styleClass和一些自定义CSS,使其看起来像您想要的(针对默认展示主题进行样式设置):

.myCustomOverlay .ui-overlaypanel-content {
    background-color: lightpink;
    padding-right: 2em;
}

.myCustomOverlay .ui-overlaypanel-close.ui-state-default {
    background-color: transparent;
    background-image: none;
    border: medium none;
    box-shadow: 0 0 0 transparent;
    right: 5px;
    top: 5px;
}

You can try this online with a browser developer tool 您可以使用浏览器开发人员工具在线尝试

If you want it to be visible inline, I'd use a panel and style that in a similar fashion 如果您希望它在行内可见,我将以类似的方式使用面板和样式

.myPanel.ui-panel {
    background: none repeat scroll 0 0 lightpink;
}

.myPanel .ui-panel-titlebar.ui-widget-header {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
}

.myPanel .ui-panel-titlebar-icon {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    box-shadow: 0 0 0 transparent;
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM