2015-02-06 4 views
0

Primefaces 5Primefaces компонент похож на р: сообщения

Есть ли компонент, который показывает данные, аналогичные p:messages компонента. То есть greyed/color box с кнопкой закрытия, но без предупреждающего знака.

enter image description here

Или как вы можете использовать Messages компонент, чтобы показать любого содержания в качестве компонента панели.

EDIT: Если панель сообщений должна отображаться для нескольких обновлений, насколько я знаю, вы должны использовать FacesContext для добавления сообщения для каждого обновления. Я не хочу этого делать.

EDIT2: Это то, чего я хочу достичь. В лучшем случае с компонентой -поверхности.

enter image description here

Как вы можете видеть:

  1. любое содержание
  2. команда ссылка
  3. кнопка закрытия
+2

Что еще вы хотите сделать с своим сообщением? Откуда это сообщение? Если вы просто не хотите иметь дело с FacesContext самостоятельно, подумайте об использовании 'Messages' из omnifaces ... – stg

+0

Компонент' p: panel'. Желательно иметь такой компонент, но с видом сообщений. Я боюсь, что нет такого компонента, который бы выглядел как сообщения. Спасибо за отзыв Omnifaces. – Tony

+1

Затем проверьте сгенерированный вывод HTML 'p: messages'. В основном это только тег div, для которого свойство css 'display' установлено на' none', при нажатии значка close. Это можно легко сделать либо с помощью обычного JavaScript, либо (как это делается в сообщениях p:) через jQuery. – stg

ответ

1

Зависит, если вы хотите быть инлайн или вид ' выскакивать'.

Если вы хотите, чтобы это не всегда Запись видна, я бы использовать 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; 
} 

вы можете попробовать это в Интернете с помощью инструмента для разработчиков браузера

Если вы хотите, чтобы быть видимым инлайн, я хотел бы использовать панель и стиль, который аналогичным образом

.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; 
} 
+0

Это выглядит хорошо. Я попробовал ваше предложение. Как вы просили, он должен быть встроенным, как обычная панель. И иметь фиксированное положение, но, возможно, это еще один вопрос. – Tony

+0

Извините, я не упоминал об этом, как вы просите в комментариях. – Tony

+0

Внутренний вид противоречит фиксированному положению. Панель встроена, рычание - фиксированное положение ... – Kukeltje