Date Range Filter
Experimental feature since version 1.96. The API may change.
Date range filter allows users to select a relative or an absolute time period.
Properties
Property |
Type |
Default Value |
Required |
Description |
Schema Version |
Since |
value |
DateRangeFilterValue |
|
Yes |
The value of the filter. |
1.37.0 |
1.96 |
options |
string[] |
[
"date",
"today",
"dateRange",
"from",
"to",
"lastDays",
"nextDays",
"lastWeeks",
"nextWeeks"
] |
No |
The options that will appear in the dropdown.
For all possible values see the Options table.
|
1.37.0 |
1.96 |
DateRangeFilterValue Properties
Property |
Type |
Default Value |
Required |
Description |
Schema Version |
Since |
option |
string |
|
Yes |
The date range option. It should be one of the set options . |
1.37.0 |
1.96 |
values |
array |
|
Yes |
Values to initialize the option. Some use dates, while others require quantifier of type integer.
When date is used, every valid parameter for JavaScript Date constructor like timestamp or date string can be used.
For each option see the Options table.
|
1.37.0 |
1.96 |
Options
Option |
Description |
Required Values |
date |
Specific date |
[Date] |
today |
|
[] |
yesterday |
|
[] |
tomorrow |
|
[] |
dateRange |
Period between two dates |
[Date, Date] |
from |
|
[Date] |
to |
|
[Date] |
yearToDate |
Range between the first day of the current year and today |
[] |
lastDays |
Last "X" days |
[int] |
lastWeeks |
Last "X" weeks |
[int] |
lastMonths |
Last "X" months |
[int] |
lastQuarters |
Last "X" quarters |
[int] |
lastYears |
Last "X" years |
[int] |
nextDays |
Next "X" days |
[int] |
nextWeeks |
Next "X" weeks |
[int] |
nextMonths |
Next "X" months |
[int] |
nextQuarters |
Next "X" quarters |
[int] |
nextYears |
Next "X" years |
[int] |
todayFromTo |
Today - "X" days / + "Y" days |
[int, int] |
thisWeek |
|
[] |
lastWeek |
|
[] |
nextWeek |
|
[] |
specificMonth |
Month from the start of the year. For example, "0" for January, "11" for December,
"-1" for December the previous year, "12" for January of the following year, and so on. |
[int] |
thisMonth |
|
[] |
lastMonth |
|
[] |
thisQuarter |
|
[] |
lastQuarter |
|
[] |
nextQuarter |
|
[] |
quarter1 |
|
[] |
quarter2 |
|
[] |
quarter3 |
|
[] |
quarter4 |
|
[] |
thisYear |
|
[] |
lastYear |
|
[] |
nextYear |
|
[] |
Filters Model
The following values are available for filter of type "DateRange":
Path |
Description |
{filters>/keyOfTheFilter/value/option} |
The current option. |
{filters>/keyOfTheFilter/value/values} |
The current option values. |
{filters>/keyOfTheFilter/range/start} |
The start date of the range in ISO 8601 format. |
{filters>/keyOfTheFilter/range/end} |
The end date of the range in ISO 8601 format. |
{filters>/keyOfTheFilter/rangeOData/start} |
The start date of the range in ISO 8601 format. It is in the boundaries of Edm.DateTime type of the OData protocol. |
{filters>/keyOfTheFilter/rangeOData/end} |
The end date of the range in ISO 8601 format. It is in the boundaries of Edm.DateTime type of the OData protocol. |
Examples
A filter for product category is defined and later used inside a data request.
{
"sap.card": {
"configuration": {
"filters": {
"activityPeriod": {
"type": "DateRange",
"value": {
"option": "today",
"values": []
}
}
}
},
"data": {
"request": {
"request": {
"url": "/activities",
"parameters": {
"startDate": "{filters>/activityPeriod/range/start}",
"endDate": "{filters>/activityPeriod/range/end}"
}
}
}
},
"type": "Timeline",
"header": {
"title": "My Activities"
},
"content": {
...
}
}
}
Try it Out