- Latest Version 1.128
- Version 1.126
- SAPUI Version 1.124
- SAPUI5 Version 1.122
- SAPUI5 Version 1.120
- SAPUI5 Version 1.118
- SAPUI5 Version 1.114
- SAPUI5 Version 1.112
- SAPUI5 Version 1.110
- SAPUI5 Version 1.108
- SAPUI5 Version 1.106
- SAPUI5 Version 1.104
- SAPUI5 Version 1.102
- SAPUI5 Version 1.100
- SAPUI5 Version 1.98
- SAPUI5 Version 1.96
- SAPUI5 Version 1.94
- SAPUI5 Version 1.92
- SAPUI5 Version 1.90
- SAPUI5 Version 1.88
- SAPUI5 Version 1.86
- SAPUI5 Version 1.84
- SAPUI5 Version 1.82
- SAPUI5 Version 1.80
- SAPUI5 Version 1.78
- SAPUI5 Version 1.76
- SAPUI5 Version 1.74
- SAPUI5 Version 1.72
- SAPUI5 Version 1.70
- SAPUI5 Version 1.68
- SAPUI5 Version 1.66
- SAPUI5 Version 1.64
- SAPUI5 Version 1.62
- SAPUI5 Version 1.60
- SAPUI5 Version 1.58
- SAPUI5 Version 1.56
- SAPUI5 Version 1.54
- SAPUI5 Version 1.52
- SAPUI5 Version 1.50
- SAPUI5 Version 1.48
- SAPUI5 Version 1.46
- SAPUI5 Version 1.44
- SAPUI5 Version 1.42
- SAPUI5 Version 1.40
- SAPUI5 Version 1.38
- SAPUI5 Version 1.36
- SAPUI5 Version 1.34
- SAPUI5 Version 1.32
- SAPUI5 Version 1.30
- SAPUI5 Version 1.28
- SAPUI5 Version 1.26
- Latest Version 1.128
- Version 1.126
- SAPUI Version 1.124
- SAPUI5 Version 1.122
- SAPUI5 Version 1.120
- SAPUI5 Version 1.118
- SAPUI5 Version 1.116
- SAPUI5 Version 1.114
- SAPUI5 Version 1.112
- SAPUI5 Version 1.110
- SAPUI5 Version 1.108
- SAPUI5 Version 1.106
- SAPUI5 Version 1.104
- SAPUI5 Version 1.102
- SAPUI5 Version 1.100
- SAPUI5 Version 1.98
- SAPUI5 Version 1.96
- SAPUI5 Version 1.94
- SAPUI5 Version 1.92
- SAPUI5 Version 1.90
- SAPUI5 Version 1.88
- SAPUI5 Version 1.86
- SAPUI5 Version 1.84
- SAPUI5 Version 1.82
- SAPUI5 Version 1.80
- SAPUI5 Version 1.78
- SAPUI5 Version 1.76
- SAPUI5 Version 1.74
- SAPUI5 Version 1.72
- SAPUI5 Version 1.70
- SAPUI5 Version 1.68
- SAPUI5 Version 1.66
- SAPUI5 Version 1.64
- SAPUI5 Version 1.62
- SAPUI5 Version 1.60
- SAPUI5 Version 1.58
- SAPUI5 Version 1.56
- SAPUI5 Version 1.54
- SAPUI5 Version 1.52
- SAPUI5 Version 1.50
- SAPUI5 Version 1.48
- SAPUI5 Version 1.46
- SAPUI5 Version 1.44
- SAPUI5 Version 1.42
- SAPUI5 Version 1.40
- SAPUI5 Version 1.38
- SAPUI5 Version 1.36
- SAPUI5 Version 1.34
- SAPUI5 Version 1.32
- SAPUI5 Version 1.30
- SAPUI5 Version 1.28
- SAPUI5 Version 1.26
Formatting Dates
sap.ui.core.format.DateFormat
Intro
This article describes the international rules for date formats. The SAPUI5 date formatters will help you to comply with these rules.
Usage
Use date formatting if:
- You need to display dates based on the user’s locale settings.
- The application is used in an international context.
Types
You can use five different types of date formats: short, medium, long, full, and relative. The formatting and order of the values differ based on the locale settings that have been configured in the browser.
Short Format
Dates in the short format are displayed as digits for the day, month, and year. Use the correct formatting to avoid errors.
English (US): 8/17/23
Spanish (ES): 17/8/23
Chinese (CN): 23/8/17
German (DE): 17.08.23
Medium Format
In general, you should opt to use the medium date format, which usually shows an abbreviation of the month as text.
English (US): Aug 17, 2023
Spanish (ES): 17 de ago. de 2023
Chinese (CN): 2023年8月17日
German (DE): 17.08.2023
Long Format
Use the long format if you need to display the full names of months. For some languages there may be no difference between the medium and long formats.
English (US): August 17, 2023
Spanish (ES): 17 de agosto de 2023
Chinese (CN): 2023年8月17日
German (DE): 17. August 2023
Full Format
If you need to display the day of the week, use the full date format.
English (US): Thursday, August 17, 2023
Spanish (ES): jueves, 17 de agosto de 2023
Chinese (CN): 2023年8月17日星期四
German (DE): Donnerstag, 17. August 2023
Relative Format
If it suits your use case, such as ongoing events within a period of six days, use the relative format. Relative dates are displayed as text, for example, today, 6 days, and so on.
The default range for relative dates is between -6 and 6 days relative to the current date.
English (US): 2 days ago, yesterday, today, tomorrow, in 2 days
Spanish (ES): hace dos días, ayer, hoy, mañana, dentro de 2 días
Chinese (CN): 2 天前,昨天,今天,明天,2 天后
German (DE): vor 2 Tagen, gestern, heute, morgen, in 2 Tagen
Guidelines
- In general, use the medium date format.
- Use the date picker control if dates have to be entered in an input field.
Object List Item and Object Header
Object list item and object header attributes should be formatted with the long type. If space is at a premium, for example, if attributes consist of a label and a date, use the short date format.
Resources
Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.
Elements and Controls
- Date Picker (guidelines)
- Object List Item (guidelines)
- Object Header (guidelines)
- Object Display Components (guidelines)
- Responsive Table (guidelines)