JSF 消息的不同 CSS 样式

发布于 2024-11-06 03:43:59 字数 690 浏览 0 评论 0原文

在 JSF 中，我在 xhtml 文件中包含了以下行：

<h:panelGroup id="messageHeader">
   <h:messages for="messageHeader" layout="list" errorClass="error"  infoClass="inform"/>
</h:panelGroup>

The text gets render as

<ul>
  <li class="error"> Please enter a First Name </li>
  <li class="error"> Please enter a Last Name </li>
</ul>

How do I get the CSS style to apply to the

< span>

这就是我正在尝试做的事情。我希望所有错误消息都显示在一个红色框中。我还希望所有信息消息都显示在一个绿色框中。上面的例子产生了 2 个红色框；每个

项目一个。

原文

In JSF, I have included the following line in my xhtml file:

<h:panelGroup id="messageHeader">
   <h:messages for="messageHeader" layout="list" errorClass="error"  infoClass="inform"/>
</h:panelGroup>

The text gets rendered as

<ul>
  <li class="error"> Please enter a First Name </li>
  <li class="error"> Please enter a Last Name </li>
</ul>

How do I get the CSS style to apply to the <ul> tag or some surrounding <span> tag?

Here is what I am trying to do. I want all error messages to appear in a single red box. I also want all info messages to appear in a single green box. The example above produces 2 red boxes; one for each <li> item.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

浅黛梨妆こ 2024-11-13 03:43:59

使用的 styleClass 属性。它将应用于父 HTML 元素。

例如，

<h:messages styleClass="messages" />

最终将成为

<ul class="messages">
    ...
</ul>

更新：您似乎想在单独列表中显示信息和错误消息。使用两个来隐藏其他严重性。

<h:messages styleClass="errorMessages" infoStyle="hide" />
<h:messages styleClass="infoMessages" errorStyle="hide" />

和

.hide {
    display: none;
}

Use the styleClass attribute of <h:messages>. It will be applied on the parent HTML element.

E.g.

<h:messages styleClass="messages" />

will end up as

<ul class="messages">
    ...
</ul>

Update: you seem to want to show info and error messages in separate lists. Use two <h:messages/> instead on which you hide the other severity.

<h:messages styleClass="errorMessages" infoStyle="hide" />
<h:messages styleClass="infoMessages" errorStyle="hide" />

with

.hide {
    display: none;
}

回复收藏 0 原文

智商已欠费 2024-11-13 03:43:59

这可以通过为需要在适当条件下显示的每种消息类型提供 h:messages 标记来完成。例如，错误消息类型：

<h:panelGroup id="errorMessageHeader" class="whatever you need" rendered="#{FacesContext.isValidationFailed()}">
   <h:messages for="errorMessageHeader" layout="list" errorClass="error" />
</h:panelGroup>

其他消息类型的条件，您可以通过组合以下方法找到

javax.faces.context.FacesContext

谢谢，
AK

This could be done by providing h:messages tag for each message type you need to show with appropriate condition. For exapmle for error message type:

<h:panelGroup id="errorMessageHeader" class="whatever you need" rendered="#{FacesContext.isValidationFailed()}">
   <h:messages for="errorMessageHeader" layout="list" errorClass="error" />
</h:panelGroup>

Conditions for other message types you can find by combining methods from