Overview

Datepicker with dropdowns for Day, Month, and Year with dynamic selection.  

Note: This was built on Mendix version 9.6.2, but should work (in theory) on any Mendix 9 version

Further documentation with screenshots is available on GitHub.

Documentation

Description

Datepicker with dropdowns for Day, Month, and Year with dynamic selection. 

Further documentation with screenshots is available on GitHub.

Typical usage scenario

• Dates that are not in the current year (i.e. birthdays)
• Selecting dates that don’t need a specific day – the widget allows only a month and a year selection (i.e. college graduation)
• Selecting only a year (i.e. model of a car)

Features and limitations

Features

• Ability to control the order of the dropdowns (i.e. month, day, year or day, month, year ...)
• Ability to control the format of the months (i.e. 2, Feb, or February)
• Ability to control the format of the days (i.e. 4, 4th)
• Ability to control how many years are selectable as an integer expression (i.e. parseInteger(formatDateTime([%CurrentDateTime%], 'yyyy')) - 50)
• Automatically changes the selectable days by the month and year
• Ability to use each dropdown individually (i.e. only select year, only select month and year...)

Limitations

• Selecting the default value in the dropdown will reset all the dropdowns and the date

Configuration

1. In the General tab, select the date attribute that you want the user to select.
2. Set "Show label" to "Yes" and type the name of the attribute the user is entering (i.e. Birth Date).
3. Decide which dropdown you want the user to select and turn OFF any you do not want them to select.
4. Decide the order you want the dropdowns to display and change the "Day Sort", "Month Sort", and "Year Sort" accordingly (i.e. Month, Day, Year would be Month Sort = 1, Day Sort = 2, and Year Sort = 3).
5. Decide on the format for the Days and Months and change the "Day Display" and "Month Display" accordingly.
6. In the Year Settings tab, decide on the range of years you want to be selectable and set the "Minimum Year" and "Maximum Year" as an expression of [%CurrentDateTime%] (this way the dropdown will automatically get new values each year). For example, use parseInteger(formatDateTime([%CurrentDateTime%], 'yyyy')) - 100 for 100 years ago.
7. Also in the Year Settings, decide on the order you want the years to display by setting "Sort Years Ascending?". "Yes" = 2019, 2020, 2021. "No" = 2021, 2020, 2019.

Known bugs

None at this time. You can submit any issues on GitHub.