Date Picker

The administrator has to enter a user’s birthday using the ISO-8601 format of YYYY-MM-DD. This is not very user friendly since there is no date picker to select a date and, most likely, this is not the date format the user typically thinks of. Luckily, there are many date picker components freely available. We’ll implement one of them here to show how it can be done using Thymeleaf.

Duet Date Picker

The date picker we chose is the Duet Date Picker because it looks good, has extensive functionality, supports accessibility, and is small (~10kb). We’ll start by adding the JavaScript and CSS of the component to the section of our layout.html base template: