The <h:message> is used in JSF to display a single
info/warn/error/fatal message for a specific component
(depending on how is used, it produces a <span> tag or no extra HTML markup)
Common/basic
usage in JSF:
<?xml
version='1.0' encoding='UTF-8' ?>
<!DOCTYPE
html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<title>JSF message examples</title>
</h:head>
<h:body>
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange
for="ageId" minimum="18" maximum="45" />
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"/>
<h:message id="ageMsgId" for="ageId"/>
</h:form>
</h:body>
</html>
For an invalid value (e.g. empty string), the <h:message>
will be rendered in HTML as:
·
<h:message id="ageMsgId"
for="ageId"/> as:
<span
id="j_idt6:ageMsgId">age: Validation Error: Value is not of the
correct type.</span>
·
<h:message for="ageId"/> as:
age:
Validation Error: Value is not of the correct type.
For an invalid value (e.g. 10), the <h:message> will be rendered in HTML as:
For an invalid value (e.g. 10), the <h:message> will be rendered in HTML as:
· <h:message id="ageMsgId" for="ageId"/> as:
<span id="j_idt6:ageMsgId">age:
Validation Error: Specified attribute is not between the expected values of 18
and 45.</span>
· <h:message for="ageId"/> as:
age:
Validation Error: Specified attribute is not between the expected values of 18
and 45.
The PlayerBean
will be:
package
beans;
import
java.io.Serializable;
import
javax.enterprise.context.SessionScoped;
import
javax.inject.Named;
@Named
@SessionScoped
public class
PlayerBean implements Serializable {
private String age;
public String getAge() {
return age;
}
public void setAge(String age) {
this.age = age;
}
}
Data flow in
image:
Styling messages with inner CSS code
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"
style="color: red;"/>
</h:form>
Styling messages with CSS
class
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"
styleClass="messagecss"/>
</h:form>
The infoStyle/infoClass - Styling an info message with inner style / CSS class (only FacesMessage.SEVERITY_INFO will have this style)
<h:form
id="IformId">
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton value="Send"
action="#{playerBean.info()}"/>
<!-- infoStyle -->
<h:message for="ageId" infoStyle="color:green;font-size:20px;"/>
<!-- infoClass -->
<h:message for="ageId"
infoClass="infocss"/>
</h:form>
In the first
case, the inserted value, 10, is not valid, so the applications
"stops" in the Process Validations phase, and a message of type error
is returned. This message doesn't benefit of a custom CSS, so is displayed via JSF default style. When a valid
value is provided, the application flow reaches a dummy PlayerBean method,
named info().
This method simply put in messages queue an message of type info, which will be
styled via infoStyle/infoClass
(the presence of these tags, will force the messages to be rendered in a <span>
element):
public void
info() {
FacesContext context =
FacesContext.getCurrentInstance();
// add an info message
context.addMessage("IformId:ageId",
new FacesMessage(FacesMessage.SEVERITY_INFO, "This is an info message
!", "This message is just a dummy info message to see how it works
!"));
}
The warnStyle/warnClass - Styling an warning message with inner style / CSS class (only FacesMessage.SEVERITY_WARN will have this style)
<h:form
id="WformId">
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton value="Send"
action="#{playerBean.warn()}"/>
<!-- warnStyle -->
<h:message for="ageId"
warnStyle="color:orange;font-size:20px;"/>
<!-- warnClass -->
<h:message for="ageId"
warnClass="warncss"/>
</h:form>
In the first
case, the inserted value, 10, is not valid, so the applications
"stops" in the Process Validations phase, and a message of type error
is returned. This message doesn't benefit of a custom CSS, so is displayed via JSF default style. When a valid
value is provided, the application flow reaches a dummy PlayerBean method,
named warn().
This method simply put in messages queue an message of type warning, which will
be styled via warnStyle/warnClass
(the presence of these tags, will force the messages to be rendered in a <span>
element):
public void
warn() {
FacesContext context =
FacesContext.getCurrentInstance();
// add an warning message
context.addMessage("WformId:ageId",
new FacesMessage(FacesMessage.SEVERITY_WARN, "This is an warning message
!", "This message is just a dummy warning message to see how it works
!"));
}
The errorStyle/errorClass - Styling an error message with inner style / CSS class (only FacesMessage.SEVERITY_ERROR will have this style)
<h:form
id="EformId">
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton value="Send"
action="#{playerBean.error()}"/>
<!-- errorStyle -->
<h:message for="ageId"
errorStyle="color:red;font-size:20px;"/>
<!-- errorClass -->
<h:message for="ageId"
errorClass="errorcss"/>
</h:form>
In the first
case, the inserted value, 10, is not valid, so the applications
"stops" in the Process Validations phase, and a message of type error
is returned. This message is styled via errorStyle/errorClass.
When a valid value is provided, the application flow reaches a dummy PlayerBean
method, named error().
This method simply put in messages queue an message of type error, which will
be styled via warnStyle/warnClass
(the presence of these tags, will force the messages to be rendered in a <span>
element):
public void
error() {
FacesContext context =
FacesContext.getCurrentInstance();
// add an error message
context.addMessage("EformId:ageId",
new FacesMessage(FacesMessage.SEVERITY_ERROR, "This is an error message
!", "This message is just a dummy error message to see how it works
!"));
}
The fatalStyle/fatalClass - Styling a fatal error message with inner style / CSS class (only FacesMessage.SEVERITY_FATAL will have this style)
<h:form
id="FformId">
<h:outputLabel value="Age:" for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton value="Send"
action="#{playerBean.fatal()}"/>
<!-- fatalStyle -->
<h:message for="ageId"
fatalStyle="color:magenta;font-size:20px;"/>
<!-- fatalClass -->
<h:message for="ageId"
fatalClass="fatalcss"/>
</h:form>
In the first
case, the inserted value, 10, is not valid, so the applications
"stops" in the Process Validations phase, and a message of type error
is returned. This message doesn't benefit of a custom CSS, so is displayed via JSF default style. When a valid
value is provided, the application flow reaches a dummy PlayerBean method,
named fatal().
This method simply put in messages queue an message of type fatal, which will
be styled via fatalStyle/fatalClass
(the presence of these tags, will force the messages to be rendered in a <span>
element):
public void
fatal() {
FacesContext context =
FacesContext.getCurrentInstance();
// add an error message
context.addMessage("FformId:ageId",
new FacesMessage(FacesMessage.SEVERITY_FATAL, "This is an fatal message
!", "This message is just a dummy fatal message to see how it works
!"));
}
The xxxStyle/xxxClass - Styling an info/warn/error/fatal message with inner style / CSS class
<h:form
id="ALLformId">
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validateLongRange for="ageId"
minimum="18" maximum="45" />
</h:inputText>
<h:commandButton value="Send"
action="#{playerBean.randomMessage()}"/>
<!-- xxxStyle
-->
<h:message for="ageId"
infoStyle="color:green;font-size:20px;"
warnStyle="color:orange;font-size:20px;"
errorStyle="color:red;font-size:20px;" fatalStyle="color:magenta;font-size:20px;"/>
<!-- xxxClass
-->
<h:message for="ageId" infoClass="infocss"
warnClass="warncss" errorClass="errorcss"
fatalClass="fatalcss"/>
</h:form>
In this case,
a message will be styled depending on its type. For testing purposes, we have
used a method capable to generate a random type message, so submit the form
several times to see how each message type is styled:
public void
randomMessage() {
FacesContext context =
FacesContext.getCurrentInstance();
Random rnd = new Random();
int msgtype = 1+rnd.nextInt(4);
switch (msgtype) {
case 1:
context.addMessage("ALLformId:ageId",
new FacesMessage(FacesMessage.SEVERITY_INFO, "This is an info message
!", "This message is just a dummy info message to see how it works
!"));
break;
case 2:
context.addMessage("ALLformId:ageId", new
FacesMessage(FacesMessage.SEVERITY_WARN, "This is an warning message
!", "This message is just a dummy warning message to see how it works
!"));
break;
case 3:
context.addMessage("ALLformId:ageId", new
FacesMessage(FacesMessage.SEVERITY_ERROR, "This
is an error message !", "This message is just a dummy error message
to see how it works !"));
break;
case 4:
context.addMessage("ALLformId:ageId", new
FacesMessage(FacesMessage.SEVERITY_FATAL, "This is an fatal message
!", "This message is just a dummy fatal message to see how it works
!"));
break;
}
}
The next
examples takes use of a custom validator that always return a invalid message
containing summary and detail:
package
beans;
import
javax.faces.application.FacesMessage;
import
javax.faces.component.UIComponent;
import
javax.faces.context.FacesContext;
import
javax.faces.validator.FacesValidator;
import
javax.faces.validator.Validator;
import
javax.faces.validator.ValidatorException;
@FacesValidator(value
= "myValidator")
public class
MyValidator implements Validator {
@Override
public void validate(FacesContext context,
UIComponent component, Object value) throws ValidatorException {
FacesMessage message = new FacesMessage();
message.setDetail("Detail: I'm a dummy detail section.");
message.setSummary("Summary: Dummy!");
message.setSeverity(FacesMessage.SEVERITY_ERROR);
throw new ValidatorException(message);
}
}
Show message details, don't show summary - this is default
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validator
validatorId="myValidator"/>
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId" showSummary="false"
showDetail="true" errorClass="errorcss"/>
</h:form>
Show message summary, don't show detail
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validator
validatorId="myValidator"/>
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"
showSummary="true" showDetail="false"
errorClass="errorcss"/>
</h:form>
Show message summary and detail
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validator
validatorId="myValidator"/>
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"
showSummary="true" showDetail="true" errorClass="errorcss"/>
</h:form>
Show message summary, and detail via tooltip attribute
<h:form>
<h:outputLabel value="Age:"
for="ageId"/>
<h:inputText id="ageId"
value="#{playerBean.age}" label="age">
<f:validator
validatorId="myValidator"/>
</h:inputText>
<h:commandButton
value="Send"/>
<h:message for="ageId"
tooltip="true" showSummary="true" showDetail="false"
errorClass="errorcss"/>
</h:form>
Complete source code on GitHub.
See also Mkyong.com.
More resources on Constantin Alin, ZEEF page.
Message in JSF Extension on JSF ShowCase ZEEF page.
Niciun comentariu :
Trimiteți un comentariu