JSF Error Messages Example Tutorial

Filed Under: JSF

In this section, we will see how to use the default JSF validators to shoot out the built in error messages to the users.

Some of the points to keep in mind before we write the xhtml file are:

The h:message tag is used to display all the error messages related to the UI components.

This h:message has the following attributes

id attribute is the unique identifier for a ui component.

style displays the style information like color,font etc

for attribute describes the component name applicable for the form.

Let’s look in detail with an example as how to display the error messages

Create a JSF page named error.xhtml as

error.xhtml


<?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://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsf/core">
<h:head>
	<title>Facelet Title</title>
</h:head>
<h:body>

	<h1>Standard Error messages</h1>

	<h:form>
		<h:panelGrid columns="3">
			<h:outputLabel value="Car Id" for="Id"></h:outputLabel>
			<h:inputText value="#{car.id}" id="Id" required="true" label="Car Id"></h:inputText>
			<h:message for="Id" style="color: red"></h:message>


			<h:outputLabel value="Car Name"></h:outputLabel>
			<h:inputText value="#{car.cname}" id="cname" label="Car Name">
				<c:validateLength minimum="5" maximum="10" for="cname" id="cname" />
			</h:inputText>

			<h:message for="cname" style="color: red"></h:message>
			<h:outputLabel value="Mfd Date" for="mfddate"></h:outputLabel>
			<h:inputText value="#{car.mfddate}" id="mfddate" label="Mfd Date">
				<c:convertDateTime />
			</h:inputText>

			<h:message for="mfddate" style="color:red"></h:message>

			<h:outputLabel value="Price" for="price"></h:outputLabel>
			<h:inputText value="#{car.price}" id="price" label="Price">
				<c:validateDoubleRange minimum="3.25" maximum="15.45" for="price"></c:validateDoubleRange>
			</h:inputText>

			<h:message for="price" style="color:red"></h:message>

			<h:outputLabel value="Engine" for="engine"></h:outputLabel>
			<h:selectOneRadio value="#{car.engine}" id="engine" required="true"
				label="engine">
				<c:selectItem itemValue="Petrol" itemLabel="Petrol" />
				<c:selectItem itemValue="Diesel" itemLabel="Diesel" />
			</h:selectOneRadio>
			<h:message id="message" for="engine" style="color:red"></h:message>

			<h:commandButton action="#{car.id}" value="Submit"></h:commandButton>
			<br />
			<br />
		</h:panelGrid>



	</h:form>

</h:body>
</html>

In the above JSF page the required=true is set so that the field is mandatory and the validation message is displayed from a file called messages.properties which is present in the JSF jars.

For minimum and maximum length validation we use <c:validateLength> tag which validates against the minimum and maximum number of characters and prints the validations from the messages.properties file.

The validation for price field works in a similar way the difference being that the entered value is checked for double data type.

The radio button validator checks if the user has specified one of Petrol or Diesel engine and if none, an error is flashed on the screen. The date validator checks if a correct date format was entered by the user. In all these cases, we don’t have to write our own logic of field validation since JSF provides built in features for these kinds of common cases.

Now let’s create a managed bean Car.java as


package com.journaldev.jsf.beans;

import java.util.Date;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.validation.constraints.NotNull;

@ManagedBean
@SessionScoped
public class Car {
    
    private String cname;
    private String color;
    private String Id;
    private String model;
    private String regno;
    private Date mfddate;
    private Double price;
    private String description;
   
    @NotNull(message="Please select the engine type")
    private String engine;

    public String getEngine() {
        return engine;
    }

    public void setEngine(String engine) {
        this.engine = engine;
    }

    

    public String getColor() {
        return color;
    }

    public void setColor(String color) {
        this.color = color;
    }

    public String getCname() {
        
        System.out.println("car name is"+cname);
        return cname;
    }

    public void setCname(String cname) {
        this.cname = cname;
    }

    public String getDescription() {
        return description;
    }

    public void setDescription(String description) {
        this.description = description;
    }
    
    public String getRegno() {
        return regno;
    }

    public void setRegno(String regno) {
        this.regno = regno;
    }
    

    public String getModel() {
        return model;
    }

    public void setModel(String model) {
        this.model = model;
    }

    public String getId() {
        return Id;
    }

    public void setId(String Id) {
        this.Id = Id;
    }
    
    public Date getMfddate() {
        return mfddate;
    }

    public void setMfddate(Date mfddate) {
        this.mfddate = mfddate;
    }
    
    public Double getPrice() {
        return price;
    }

    public void setPrice(Double price) {
        this.price = price;
    }
    
}

Once done with this changes run the code and following output should be produced in the browser

JSF Error Messages -1

The project structure is as below image.

JSF_ErrorMessages_Project

This post is all about handling JSF Error Messages with the help of JSF validators. We will be looking into JSF Page Navigation in the coming tutorial. In the mean time, you can download the project from below link and play around with it to learn more.

Comments

  1. Pablo says:

    I’ve been able to follow correctly the previous examples, but in this one i have a problem when trying to run it:

    An internal error occurred during: “Launching Executing clean in D__Programa_SpringSuite_JSF_ErrorMessages”.
    java.lang.NullPointerException

  2. Mohit says:

    I tried to import this project in eclipse and run it. But the pages being displayed are completely blank. I tried inspect element in my browser but even the source code of HTML is blank not even tag. Please help me with it.

Leave a Reply

Your email address will not be published. Required fields are marked *

close
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages