Just posted my first ever directory-worthy add-on,

Please try it out, and report any bugs or missing features -_-

p.s. nice coincidence with 100 posts as well :slight_smile:


    I used TimeField add-on in my project . It displays in 12 hour format  .While changing this format to 24 hour , it is not working


   And  i also need seconds part in that filed . How do i get that ?

Thank you sir.

I have a bit of difficulty testing the 24-hour issue, but please try e.g. setLocale(Locale.FRANCE). The resolution is set by setResolution(DateField.RESOLUTION_SEC) or Resolution.SECOND if your on Vaadin7. There is a bug in the current implementation, you need to call either setLocale() or set24HourClock() after you set the resolution, sorry about that :slight_smile: I’ll update the component later this week.


    It was very helpful to me . Actually i am using Vaadin 6.8.4 version . 

Thank you very much sir.

Thanks for the add-on. It is very useful. There is only one thing that I have found not working very well, the setTabIndex() method. I have tried using it but it seems to do nothing at all.

P.S.: I am using Vaadin 6.8.7

Thank you for the kind words, and the bug report. Just uploaded a new version that should fix your issue :slight_smile:

It works! Thank you.

Thank you for the add-on. It’s quite useful to us.

I found a minor bug which occurs when using the non-24 hour format. If the hour is between 12-1 pm then the hour field will be blank. The specific problem is in TimeField.updateFields():

if (use24HourClock) {
} else {
int h = val.getHours();
if (h == 0) {
h = 12;
} else {
h %= 12;

TimeField:265: If h= 12 then h %= 12 is 0 and this is the value which is set - which is not correct

This should be:

           if (h == 0) {
                h = 12;
           } else if (h != 12) {
                h %= 12;

The block after the ‘fix 12:xx am’ comment can be removed since it has been taken care of in the previous block.

This issue is still in the 0.7 release.


Where i can download the source code?

The newest release fixes the bug Mark pointed out (thanks for that!) and a bug in setReadOnly (thanks to Flavio Santos). I also added a link to the source code;

Hi Thomas,

I have a TimeField and want to bind it to a Timestamp Bean variable with the BeanFieldGroup.

But I get the Error:

Caused by: com.vaadin.data.fieldgroup.FieldGroup$BindException: Unable to build a field of type org.vaadin.thomas.timefield.TimeField for editing java.sql.Timestamp
	at com.vaadin.data.fieldgroup.FieldGroup.build(FieldGroup.java:1067)
	at com.vaadin.data.fieldgroup.FieldGroup.buildAndBind(FieldGroup.java:1039)
	at de.skoda.wkalender.gui.window.TerminSubWindow.buildGridLayout(TerminSubWindow.java:145)
	at de.skoda.wkalender.gui.window.TerminSubWindow.<init>(TerminSubWindow.java:62)
	at de.skoda.wkalender.gui.ui.UebersichtUI.buttonClick(UebersichtUI.java:188)
	at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
	at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
	at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
	at java.lang.reflect.Method.invoke(Method.java:601)
	at com.vaadin.event.ListenerMethod.receiveEvent(ListenerMethod.java:508)
	... 33 more

which Datatype the bean Variable must have that it works?

As it says in the code, the type is java.util.Date.

New version uploaded, with new features and bugfixes:

This Component Not Supported in Vaadin7… any Solution?


I am using Vaadin 7.1 and just tried using Timefiled along with Datefield. Whenever I change the value of Timefield the resulting value is Jan 01 “modified time” 1970(example:Jan 01 10:40:00 IST 1970). I want this to reflect the date which I have selected using Datefield.
Can you please help?


Download the Timefield addon source code from the URL https://code.google.com/p/vaadin-time-field/source/checkout.
Then modify the Timefield class as you want.I attached the TimeField class for your reference.

13577.java (11.7 KB)

Is this still available in maven?

I tried to add this:

org.vaadin.addons timefield 0.9

but it werent able to find this…

Sorry for the late reply. That snippet works fine for me; do other addons work for you?

Added a new version with a new LocalTimeField class, if you happen to be using Java8. If you aren’t, stick with the old version.

Hi all,

I was just about to use this add-on when I realized that stock Vaadin can do the same. Vaadin 7 has its own
date field implementations
and they do in fact allow time-only input.

All what is needed is to hide the date part.

Put this in your SCSS:

  // Gives possibility to show an InlineDateField with
  // time-only. Just do field.addStyleName("time-only")  
  .time-only .v-inline-datefield-calendarpanel-header,
  .time-only .v-inline-datefield-calendarpanel-body {
      display: none;

  // Gives possibility to show a PopupDateField with
  // time-only. Just do field.addStyleName("time-only")  
  .time-only .v-datefield-calendarpanel-header,
  .time-only .v-datefield-calendarpanel-body {
      display: none;

Now, whenever you need say a
with only the time all you have to do is something like this:

Field myTimeOnlyField = new PopupDateField();

For the user this will seem to be a time-only field. The field itself will still set/get a
but you can of course change that in a wrapper class so that it sets/gets say a
instead if that is more convenient to you. Your choice.

So there you have it: the same result with only standard Vaadin components. There may be some advantages to using the add-on, dunno. You’ll have to evaluate your options yourself.