Как лучше использовать JSF h:messages?

Моя цель - использовать h:messages для передачи пользователю сообщений об ошибках и подтверждениях. Стили CSS для отображения этих двух разных сообщений различны. На самом деле я хотел бы использовать изображение рядом с сообщением подтверждения.

e.g. :

<tr>
    <td>
        <img/>
    </td>
    <td>
        <h:msg>
    </td>
</tr>

Поэтому я попытался добавить сообщения в контекст Faces на основе двух разных идентификаторов клиентов.

<tr>
    <td height="5">
        <h:messages style="color:darkred" id="error_message" />
    </td>
</tr>

<tr>
    <td width="89%" class="InfoMsg" align="center">
        <h:messages id="confirm_message" />
    </td>
</tr>

И слой Java:

FacesMessage facesMessage = new FacesMessage(Constants.saveMessageConfirm);

FacesContext.getCurrentInstance().addMessage(Constants.STATIC_CONFIRM_MSG_CLIENT_ID, facesMessage); 

Но даже если я добавляю сообщения в clientId confirm_message — и только в confirm_message — а не в error_message — сообщение отображается дважды в двух разных стилях (см. HTML выше).

2 вопроса:

  1. В чем проблема?

  2. Если я хочу показать изображение внутри td во втором tr и условно показать этот второй tr при наличии подтверждающих сообщений - как лучше всего?

Спасибо


jsf
person gekrish    schedule 28.05.2010    source источник


Ответы (3)


h:messages отображает все сообщения, а также те, которые уже отображаются в h:message на странице. Однако вы можете настроить отображение только сообщений с идентификатором клиента null, используя globalOnly="true".

<h:messages globalOnly="true" />

Вы также можете придать сообщению другой стиль в зависимости от FacesMessage.Severity:

<h:messages infoClass="info" errorClass="error" />

например, с этим CSS, который скрывает INFO сообщения и создает ERROR< /a> сообщения красного цвета:

.info {
     display: none;
}
.error {
     color: red;
}

Вы можете использовать redisplay="false", чтобы указать ему не отображать уже отображаемые сообщения через e.e. <h:message>.

<h:messages redisplay="false" />

Вам нужно только убедиться, что он размещен в дереве компонентов после всех остальных компонентов сообщения. При необходимости вы можете использовать CSS, чтобы переместить его куда-нибудь вверх.

Просто чтобы убедиться,

facesContext.addMessage("clientId",  facesMessage);

это прикрепит данное сообщение к <h:message for="clientId">, а не к <h:messages id="clientId">, как вы ожидаете.

person BalusC    schedule 28.05.2010
comment
@this: Извините, мое утверждение было действительно неверным. Никто не идеален :) Пожалуйста, обновите свой вопрос. Я обновил этот и другой ответ. Спасибо за пробуждение. - person BalusC; 15.05.2012
comment
БлаусС, ты прекрасен. Как вы узнали, что он может иметь только один дочерний элемент? - person ggb667; 13.03.2013
comment
@BalusC Является ли хорошей практикой использование идентификатора компонента в Facelet и в компоненте поддержки в виде простой строки (как это сделано в вашем последнем примере)? Может быть, есть лучший способ синхронизировать это значение? Например. объявить константу, привязать ее значение в представлении и использовать ту же константу в коде резервного компонента? - person stasal; 08.09.2017
comment
Если вы просто хотите отображать сообщения в определенном стиле, вы можете использовать встроенный тег style без css. Пример: <h:messages style="color: red"/> - person Jack; 07.11.2020
comment
@ jackz314: встроенные стили считаются плохой практикой в ​​HTML. - person BalusC; 07.11.2020
comment
Я признаю, что поддерживать встроенный CSS непросто, но я думаю, что это разумно, если использовать его в простом проекте. В моем случае мне нужно сделать это только один раз для одной формы. - person Jack; 07.11.2020

изменить <h:messages> на <h:message>

<h:messages отображает все сообщения для текущего контекста, <h:message> отображает конкретное сообщение.

и я полагаю, что вы хотите изменить id на for, чтобы дать ему цель, но я могу ошибаться.

person Alex Larzelere    schedule 28.05.2010

У нас могут быть разные типы сообщений h: для разных уровней серьезности. Например, вы можете захотеть отобразить все сообщения об ошибках в красной рамке, а остальные использовать разные стили, такие как желтый для предупреждения и зеленый для информации. Вы также можете обернуть его различными панелями. Вы можете сделать это, используя разные сообщения h: и применяя стили по отдельности.

<!--Displays only Error Messages-->
<h:messages styleClass="mystyle" layout="list" id="msg1" infoStyle="display:none"       warnStyle="display:none"></h:messages>

<!--Displays only Warning Messages-->
<h:messages styleClass="messages" layout="list" id="msg2" errorStyle="display:none"     infoStyle="display:none"></h:messages>

<!--Displays only Info Messages-->
<h:messages styleClass="messages" layout="list" id="msg2" errorStyle="display:none"     warnStyle="display:none"></h:messages>
person sree    schedule 09.01.2014