JBoss.orgCommunity Documentation
The <rich:messages> component is similar to <rich:message> component but used for rendering all messages for the components.
Highly customizable look and feel
Track both traditional and Ajax based requests
Optional ToolTip to display a detailed part of the messages
Additionally customizable via attributes and facets
Additionally provides of three parts to be optionally defined: marker, label and header
Table 6.591. rich : messages attributes
Table 6.592. Component identification parameters
Name | Value |
---|---|
component-type | org.richfaces.component.RichMessages |
component-class | org.richfaces.component.html.HtmlRichMessages |
component-family | org.richfaces.component.RichMessages |
renderer-type | org.richfaces.renderkit.html.HtmlRichMessagesRendere |
tag-class | org.richfaces.taglib.RichMessagesTag |
To create the simplest variant of message on a page, use the following syntax:
Example:
...
<rich:messages/>
...
Example:
import org.richfaces.component.html.HtmlRichMessages;
...
HtmlRichMessages myMessages = new HtmlRichMessages();
...
The <rich:messages> component is considered as JSF HTML <h:messages> , extended with following features:
Ajax support (the component does not require to be wrapped in <a4j:outputPanel> in order to be rendered during Ajax requests);
possibilty to add graphical markers (pictograms) to reinforce a message for both "passed" or "failed" states;
set of predefined CSS classes for customizing messages appearance.
There are two optional parts that could be defined for every message: marker and text label. The set of facets, which can be used for a marker definition, is shown below:
Table 6.593. Facets
Facet | Description |
---|---|
errorMarker | Defines marker for "Error" message severity class |
fatalMarker | Defines marker for "Fatal" message severity class |
infoMarker | Defines marker for "Info" message severity class |
warnMarker | Defines marker for "Warn" message severity class |
The following example shows different variants of customization of the component.
Example:
<rich:messages layout="table" tooltip="true" showDetail="false" showSummary="true">
<f:facet name="errorMarker">
<h:graphicImage url="/image/error.png"/>
</f:facet>
<f:facet name="infoMarker">
<h:graphicImage url="/image/info.png"/>
</f:facet>
</rich:messages>
The <rich:messages> component keeps all messages for all components even after only one Ajax-validated component was updated.
For skinnability implementation, the components use a style class redefinition method.
There are no skin parameters and default predefined values. To redefine the appearance of all <rich:messages> components at once, you should only add to your style sheets style classes used by a <rich:messages> component.
On the screenshot there are classes names that define styles for component elements.
Table 6.594. Classes names that define a component appearance
Class name | Description |
---|---|
rich-messages | Defines styles for a wrapper element |
rich-messages-marker | Defines styles for a marker |
rich-messages-label | Defines styles for a label |
In order to redefine styles for all <rich:messages> components on a page using CSS, it's enough to create classes with the same names (possible classes could be found in the tables above) and define necessary properties in them.
Example:
...
.rich-messages-label{
font-style:italic;
}
...
This is a result:
In the example the font style for messages was changed.
Also it's possible to change styles of particular <rich:messages> component. In this case you should create own style classes and use them in corresponding <rich:messages> styleClass attributes. An example is placed below:
Example:
...
.myClass{
color:red;
}
...
The "errorClass" attribute for <rich:messages> is defined as it's shown in the example below:
Example:
<rich:messages ... errorClass="myClass"/>
This is a result:
As it could be seen on the picture above, color of messages was changed.
On the component LiveDemo page you can see the example of <rich:messages> usage and sources for the given example.