JSF消息的不同CSS样式

JSF消息的不同CSS样式,jsf,coding-style,richfaces,messages,Jsf,Coding Style,Richfaces,Messages,在JSF中,我在xhtml文件中包含了以下行: <h:panelGroup id="messageHeader"> <h:messages for="messageHeader" layout="list" errorClass="error" infoClass="inform"/> </h:panelGroup> 文本呈现为 <ul> <li class="error"> Please enter a First

在JSF中,我在xhtml文件中包含了以下行:

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

文本呈现为

<ul>
  <li class="error"> Please enter a First Name </li>
  <li class="error"> Please enter a Last Name </li>
</ul>
  • 请输入名字
  • 请输入姓氏
如何将CSS样式应用于
标记或周围的
标记


这就是我要做的。我希望所有错误消息都显示在一个红色框中。我还希望所有信息信息都显示在一个绿色框中。上面的示例生成2个红色框;每个
  • 项目一个

    这可以通过为需要显示的每种消息类型提供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

    谢谢,
    A.K.

    使用
    样式类
    属性。它将应用于父HTML元素

    例如


    我将尝试这种技术,但如何测试FaceContext的信息消息?@Ryan:这个EL示例无效。正确的示例取决于您使用的是JSF1.x还是2.x,以及您使用的是JSP还是Facelets。但毕竟,还有更简单的方法。@BalusC感谢您的评论。我没有检查它是否有效,只是想说明要点。@Ryan在JSF 1.x或2.x中,可以通过比较最大服务器数(FacesContext.getMaximumSeverity())来实现,但我建议使用BalusC建议,实际上要简单得多。@BalusC但是我如何为信息指定一种样式和为错误消息指定一种单独的样式呢?就像你已经做的那样继续使用
    errorClass
    infoClass
    styleClass
    不会覆盖它。您询问如何在
      上设置
      类,对吗?@BalusC是的,我正在尝试在
        上设置类,但我希望根据消息的严重性设置不同的类。我现在意识到,
        可能会返回严重程度不同的消息。我可以只获取指定严重性级别的消息吗?是的,这是可能的。JSF1.x还是2.x?一个不同的问题可能是:我如何才能只获得错误消息?
        <h:messages styleClass="messages" />
        
        <ul class="messages">
            ...
        </ul>
        
        <h:messages styleClass="errorMessages" infoStyle="hide" />
        <h:messages styleClass="infoMessages" errorStyle="hide" />
        
        .hide {
            display: none;
        }