Panels

Messages

During the JSF life cycle, any object can create a message and add it to a queue of messages maintained by the faces context. At the end of the life cycle in the Render Response phase you can display those messages in a view. Typically, messages are associated with a particular component and indicate either conversion or validation errors.

Although error messages are usually the most prevalent message type in a JSF application, messages come in four varieties:

  • Information

  • Warning

  • Error

  • Fatal

All messages can contain a summary and a detail. For example, a summary might be Invalid Entry and a detail might be The number entered was greater than the maximum.

JSF applications use two tags to display messages in JSF pages: h:messages and h:message.

The h:messages tag displays all messages that were stored in the faces context during the course of the JSF life cycle. You can restrict those messages to global messages meaning messages not associated with a component by setting h:message's globalOnly attribute to true. By default, that attribute is false.

The h:message tag displays a single message for a particular component. That component is designated with h:message's mandatory for attribute. If more than one message has been generated for a component, h:message shows only the last one.

h:message and h:messages share many attributes. Table 4-22 lists all attributes for both tags.

Table 4-22. Attributes for h:message and h:messages
Attributes Description
errorClass CSS class applied to error messages.
errorStyle CSS style applied to error messages.
fatalClass CSS class applied to fatal messages.
fatalStyle CSS style applied to fatal messages.
for The id of the component for which to display the message (h:message only).
globalOnly Instruction to display only global messages applicable only to h:messages. Default is false.
infoClass CSS class applied to information messages.
infoStyle CSS style applied to information messages.
layout Specification for message layout: "table" or "list" applicable only to h:messages.
showDetail A Boolean that determines whether message details are shown. Defaults are false for h:messages, true for h:message.
showSummary A Boolean that determines whether message summaries are shown. Defaults are true for h:messages, false for h:message.
tooltip A Boolean that determines whether message details are rendered in a tooltip; the tooltip is only rendered if showDetail and showSummary are true.
warnClass CSS class for warning messages.
warnStyle CSS style for warning messages.
binding, id, rendered, styleClass Basic attributes.[a]
style, title, dir (JSF 1.2), lang (JSF 1.2) HTML 4.0.[b]


[a] See Table 4-4 on page 97 for information about basic attributes.

[b] See Table 4-5 on page 101 for information about HTML 4.0 attributes.

The majority of the attributes in Table 4-22 represent CSS classes or styles that h:message and h:messages apply to particular types of messages.

You can also specify whether you want to display a message's summary or detail, or both, with the showSummary and showDetail attributes, respectively.

The h:messages layout attribute can be used to specify how messages are laid out, either as a list or a table. If you specify true for the tooltip attribute and you have also set showDetail and showSummary to true, the message's detail will be wrapped in a tooltip that is shown when the mouse hovers over the error message.

Now that we have a grasp of message fundamentals, we take a look at an application that uses the h:message and h:messages tags. The application shown in Figure 4-9 contains a simple form with two text fields. Both text fields have required attributes.

Figure 4-9. Displaying messages


Moreover, the Age text field is wired to an integer property, so its value is converted automatically by the JSF framework. Figure 4-9 shows the error messages generated by the JSF framework when we neglect to specify a value for the Name field and provide the wrong type of value for the Age field.

At the top of the JSF page, we use h:messages to display all messages. We use h:message to display messages for each input field:

   <h:form>    <h:messages layout="table" error/>       ...    <h:inputText        value="#{user.name}" required="true" label="#{msgs.namePrompt}"/>    <h:message for="name" error/>       ...    <h:inputText        value="#{form.age}" required="true" label="#{msgs.agePrompt}"/>    <h:message for="age" error/>       ...    </h:form>

Note that the input fields have label attributes that describe the fields. These labels are used in the error messages for example, the Age: label (generated by #{msgs.agePrompt}) in this message:

   Age: old must be a number between -2147483648 and 2147483647 Example: 9346     

Generally, you will want to use the same expression for the label attribute as for the value of the h:outputText tag that labels the input field. For example, the age field as preceded by

   <h:outputText value = "#{msgs.agePrompt}"/>

Both message tags in our example specify a CSS class named errors, which is defined in styles.css. That class definition looks like this:

   .errors {       font-style: italic;    }

We have also specified layout="table" for the h:messages tag. If we had omitted that attribute (or alternatively specified layout="list"), the output would look like this:

The list layout encodes the error messages in an unnumbered list (whose appearance you can control through styles).

Caution

In JSF 1.1, the "list" style placed the messages one after the other, without any separators, which was not very useful.


Figure 4-10 shows the directory structure for the application shown in Figure 4-9. Listing 4-17 through Listing 4-19 list the JSP page, resource bundle, and style sheet for the application.

Figure 4-10. Directory structure for the messages example


Listing 4-17. messages/web/index.jsp

  1. <html>   2.    <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>   3.    <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>   4.    <f:view>   5.       <head>   6.          <link href="styles.css" rel="stylesheet" type="text/css"/>   7.          <title>   8.             <h:outputText value="#{msgs.windowTitle}"/>   9.          </title>  10.       </head>  11.       <body>  12.          <h:form>  13.             <h:outputText value="#{msgs.greeting}" style/>  14.             <br/>  15.             <h:messages error layout="table"/>  16.             <br/>  17.             <table>  18.                <tr>  19.                   <td>  20.                      <h:outputText value="#{msgs.namePrompt}:"/>  21.                   </td>  22.                   <td>  23.                      <h:inputText   24.                         value="#{user.name}" required="true"  25.                         label="#{msgs.namePrompt}"/>  26.                   </td>  27.                   <td>  28.                      <h:message for="name" error/>  29.                   </td>  30.                </tr>  31.                <tr>  32.                   <td>  33.                      <h:outputText value="#{msgs.agePrompt}:"/>  34.                   </td>  35.                   <td>  36.                      <h:inputText   37.                         value="#{user.age}" required="true" size="3"  38.                         label="#{msgs.agePrompt}"/>  39.                   </td>  40.                   <td>  41.                      <h:message for="age" error/>  42.                   </td>  43.                </tr>  44.             </table>  45.             <br/>  46.             <h:commandButton value="#{msgs.submitPrompt}"/>  47.          </h:form>  48.       </body>  49.    </f:view>  50. </html>     

Listing 4-18. messages/src/java/com/corejsf/messages.properties

  1. windowTitle=Using h:messages and h:message   2. greeting=Please fill out the following information   3. namePrompt=Name   4. agePrompt=Age   5. submitPrompt=Submit form

Listing 4-19. messages/web/styles.css

  1. .errors {   2.    font-style: italic;   3.    color: red;   4. }   5. .emphasis {   6.    font-size: 1.3em;   7. }

Note

By default, h:messages shows message summaries but not details. h:message, on the other hand, shows details but not summaries. If you use h:messages and h:message together, as we did in the preceding example, summaries will appear at the top of the page, with details next to the appropriate input field.




Core JavaServerT Faces
Core JavaServer(TM) Faces (2nd Edition)
ISBN: 0131738860
EAN: 2147483647
Year: 2004
Pages: 84

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net