jsflabelconvertersselectonemenudate-formatting

Format date in <f:selectItem(s) itemLabel> using DateTimeConverter


I have a <h:selectOneMenu> that has <f:selectItems> with CategoryHistory objects loaded in it. I only show the Date date field as itemLabel. That works but I want to format the date: I created a converter that extends javax.faces.convert.DateTimeConverter and change the fields in the constructor. But my dates only show in default format :(

DateAndTimeConverter.java

import javax.faces.bean.ManagedBean;
import javax.faces.convert.Converter;
import javax.faces.convert.DateTimeConverter;
import javax.faces.convert.FacesConverter;

@FacesConverter(value = "dateAndTimeconverter")
@ManagedBean
public class DateAndTimeConverter extends DateTimeConverter implements Converter {

 public DateAndTimeConverter(){  
  this.setDateStyle("short");
 }

xhtml

 <h:selectOneMenu valueChangeListener="#{admin.categoryHistoryListener}"
    onchange="submit()" value="#{admin.categoryHistory.id}" converter="#{dateAndTimeconverter}">       
  <f:selectItems value="#{admin.categoryHistories}" var="n"
     itemValue="#{n.id}" itemLabel="#{n.date}">
  </f:selectItems>
 </h:selectOneMenu>

It also doesn't work when I try:

<h:selectOneMenu valueChangeListener="#{admin.categoryHistoryListener}"
    onchange="submit()" value="#{admin.categoryHistory.id}">
  <f:converter converterId="dateAndTimeconverter"/>       
  <f:selectItems value="#{admin.categoryHistories}" var="n"
     itemValue="#{n.id}" itemLabel="#{n.date}">
  </f:selectItems>
</h:selectOneMenu>

CategoryHistory Has a Date date, and Long id +...

Thank you


Solution

  • Unfortunately, the JSF converters only applies on the input value, not on the input label.

    You'll need to solve this other ways. E.g. a getter which uses SimpleDateFormat to format the date. Or if your environment supports EL 2.2, simply invoke the converter method directly (you've it as managed bean already):

    <f:selectItems value="#{admin.categoryHistories}" var="n" itemValue="#{n.id}" 
        itemLabel="#{dateAndTimeconverter.getAsString(facesContext, component, n.date)}">
    

    If you happen to use JSF utility library OmniFaces, then you can also use its of:formatDate() function. E.g.:

    <f:selectItems value="#{admin.categoryHistories}" var="n" itemValue="#{n.id}" 
        itemLabel="#{of:formatDate(n.date, 'd MMM yyyy')}">