JSF 2 convertDateTime example

f:convertDateTime” is a standard JSF converter tag, which converts String into a specified “Date” format. In addition, it’s used to implement the date validation as well.

The following JSF 2.0 example shows you how to use this “f:convertDateTime” tag.

1. Managed Bean

A simple managed bean, with a “date” property.

package com.mkyong;
 
import java.io.Serializable;
import java.util.Date;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
 
@ManagedBean(name="receipt")
@SessionScoped
public class ReceiptBean implements Serializable{
 
	Date date;
 
	public Date getDate() {
		return date;
	}
 
	public void setDate(Date date) {
		this.date = date;
	}
 
}

2. f:convertDateTime examples

Implement the date validation with “f:convertDateTime” tag. The accepted date format is defined in the “pattern” attribute.

Note
The date format in “pattern” attribute is defined in the java.text.SimpleDateFormat.

default.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:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      >
    <h:body>
 
    	<h1>JSF 2 convertDate example</h1>
 
	<h:form>
 
		<h:panelGrid columns="3">
 
		  Receipt Date : 
		 <h:inputText id="date" value="#{receipt.date}" 
			size="20" required="true"
			label="Receipt Date" >
 
			<f:convertDateTime pattern="d-M-yyyy" />
		  </h:inputText>
 
		  <h:message for="date" style="color:red" />
 
		</h:panelGrid>
 
		<h:commandButton value="Submit" action="receipt" />
 
	   </h:form>
 
    </h:body>
</html>

receipt.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:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      >
    <h:body>
 
    	<h1>JSF 2 convertDate example</h1>
 
		Receipt Date :  
		<h:outputText value="#{receipt.date}" >
			<f:convertDateTime pattern="d-M-yyyy" />
		</h:outputText>
 
    </h:body>
</html>