Jsf convertdatetime example

by

JSF f convertdatetime tag:

JSF f:convertdatetime tag is a standard JSF converter which is used to converts a string into a date of specific format. It is also used for date format validation.

JSF convertdatetime tag attributes:

Attribute Description
type date (default), time, or both
dateStyle default, short, medium, long, or full
timeStyle default, short, medium, long, or full
pattern Formatting pattern, as defined in java.text.SimpleDateFormat
locale Locale whose preferences are to be used for parsing and formatting
timeZone Time zone to use for parsing and formatting

Example:

test.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:ui="http://java.sun.com/jsf/facelets">
	<h:head>
		<title>JSF f convert date time example.</title> 
	</h:head>
    <h:body> 
      <h3>JSF f convert date time example.</h3>
      <br/>	
      Pattern: dd-mm-yyyy
      <h:form>
        <h:inputText label="Enter Date: " 
          value="#{test.date}" required="true">
         <f:convertDateTime pattern="dd-mm-yyyy"/>
        </h:inputText>
        <br/><br/>
        <h:commandButton action="welcome.xhtml" value="Submit"/>
      </h:form>
    </h:body>
 
</html>

Test.java

import java.util.Date;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
 
/**
 * Managed bean.
 * @author w3schools
 */
@ManagedBean(name="test")
@SessionScoped
public class Test {
	private Date date;
 
	public Date getDate() {
		return date;
	}
 
	public void setDate(Date date) {
		this.date = date;
	}
}

welcome.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:ui="http://java.sun.com/jsf/facelets">
	<h:head>
		<title>JSF f convert date time example.</title>
	</h:head>
    <h:body> 
      <h3>JSF f convert date time example.</h3>
      Date: 
      <h:outputText value="#{test.date}" />
      <br/>
      Date with pattern="dd-mm-yyyy": 
      <h:outputText value="#{test.date}" >
        <f:convertDateTime pattern="dd-mm-yyyy" />
      </h:outputText>
    </h:body>
 
</html>

faces-config.xml

<?xml version="1.0" encoding="windows-1252"?>
<faces-config version="2.0" 
xmlns="http://java.sun.com/xml/ns/javaee" 
xmlns:xi="http://www.w3.org/2001/XInclude" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd">
 
</faces-config>

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0" 
    	xmlns="http://java.sun.com/xml/ns/javaee" 
    	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
    	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee 
    	http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
 
    <servlet>
        <servlet-name>faces</servlet-name>
        <servlet-class>
         javax.faces.webapp.FacesServlet
	<servlet-mapping>
        <servlet-name>faces</servlet-name>
        <url-pattern>/faces/*</url-pattern>
    </servlet-mapping>
 
</web-app>

URL:

http://localhost:7001/JSFExample30/faces/test.xhtml

Output:

JSF example30-1
 
Enter Date.
JSF example30-2 
Click Submit button.
JSF example30-3
 
Download this example.