How would you use the JSF DateTimeConverter?
If you are working with dates you probably have had a need to display them in the correct format, or even had to parse them? Well, lets start off with using dateStyle. The example below will use the "long" date style as defined by the server Locale. Valid values are "default", "short", "medium", "long", and "full".
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime dateStyle="long" type="date"/>
</h:inputText>
</html>
Now that we know how to display a date lets define a different locale. Can you guess the language?
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime dateStyle="long" locale="es" type="date"/>
</h:inputText>
</html>
Say you want to go all weird on your users. Well you can define how to display your date using a pattern.
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime pattern="yyyyMMddHHmmss" type="both"/>
</h:inputText>
</html>
What if you are only interested in the hour and minutes? Well, you can opt to only display those. And not surprisingly, you have similar options there too. Valid values are "default", "short", "medium", "long", and "full"
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime timeStyle="long" type="time"/>
</h:inputText>
</html>
What if you want to display your dates in a different timezone. Easy enough.
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime timeZone="PST" type="both"/>
</h:inputText>
</html>
If you have been paying attention you have noticed the 'type' attribute. Lets explain what that one does. It tells the converter what to expect, which is? Valid values are "date", "time", and "both". Which you have guessed, expect a date, expect a time, expect both date and time. So if the above example is changed to the example below? What happens to the output?
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime timeZone="PST" type="time"/>
</h:inputText>
</html>
If you keep an instance of a DateTimeConverter around in your managed bean you can also use binding to bind that particular instance of the DateTimeConverter to the tag on the page like so:
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:outputText value="#{user.birthDate}">
<f:convertDateTime binding="#{settings.dateTimeConverter}"/>
</h:inputText>
</html>
And a managed bean that has a method similar to the one below:
public DateTimeConverter getDateTimeConverter() {
return dateTimeConverter;
}
If you want to attach the converter to a specific component then you can use the 'for' attribute to target it. Note this attribute is really helpful when using composite components. Eg.
<html xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
<h:inputText id="myinput" value="#{user.birthDate}">
<f:convertDateTime binding="#{settings.dateTimeConverter}" for="myinput"/>
</h:inputText>
</html>
Posted October 3, 2012