Directory

← Back

EnhancedDateTimePicker

DateTimePicker with ability to format by pattern

Author

Contributors

Rating

This component is based on DateTimePicker component for Vaadin Flow and also in EnhancedDatePicker component.

The idea of the EnhancedDateTimePicker component is the possibility of adding format and parse patterns for both date & time parts of a DateTimePicker. Date part uses EnhancedDatePicker component and time part is using an extension of TimePicker component for Vaadin Flow that adds an API for setting formatting and parsing patterns.

As in EnhancedDatePicker, the formatting for the time part is done by JavaScript library date-fns v2.0.0-beta.2. More information about supported formatting paterns can be found here: https://date-fns.org/v2.0.0-beta.2/docs/format.

Main methods:

  • to set a formatting pattern for date part

    EnhancedDateTimePicker#setDatePattern(String)

  • to set a formatting pattern for time part

    EnhancedDateTimePicker#setTimePattern(String)

  • to set a parsing patterns for date part

    EnhancedDateTimePicker#setDateParsers(String ...)

  • to set a parsing patterns for time part

    EnhancedDateTimePicker#setTimeParsers(String ...)

For complete examples on EnhancedDateTimePicker see the demo class EnhancedDateTimePickerDemoView. Find the link to the repository in the Links section.

Sample code

EnhancedDateTimePicker dateTimePicker = new EnhancedDateTimePicker();
dateTimePicker.setValue(LocalDateTime.now());
dateTimePicker.setDatePattern("dd-MM-yyyy");
dateTimePicker.setTimePattern("HH.mm.ss");
dateTimePicker.setDateParsers("dd-MM-yyyy", "dd.MM.yy");
dateTimePicker.setTimeParsers("HH.mm.ss", "HH:mm");

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Bug Fixes:

  • Fix time issue in V23+ (fixes #9)
Released
2022-04-26
Maturity
TESTED
License
Apache License 2.0

Compatibility

Framework
Vaadin 23
Vaadin 22 in 2.0.3
Vaadin 21 in 2.0.3
Vaadin 20 in 2.0.1
Vaadin 19 in 1.0.2
Vaadin 18 in 1.0.2
Vaadin 17 in 1.0.2
Vaadin 16 in 1.0.2
Vaadin 15 in 1.0.2
Vaadin 14 in 1.0.2
Browser
Firefox
Safari
Google Chrome
iOS Browser
Android Browser
Microsoft Edge
Online