Creating 'From-To' Date using BloX

 Analytical Need 

Attached below is a BloX template.
A common request is to have a 'From To' input at the top of the dashboard to affect a calendar range selection of dates.
mceclip3.png
To achieve this need we can utilize BloX's form capabilities.
Picking a date range in a calendar of a 'Date' filter and looking into the jaql created by it shows the following:
mceclip0.png
We can use input fields to change the date range values selected in the from:to keys.

Solution

We will use the skeleton that creates an action that affects the selected filters:
mceclip1.png
Make sure to change the "filterName" to the right filter column name.
Also, make sure to use the right jaql that needs to be populated.
Example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
{
"type": "ActionSet",
"actions": [
{
"type": "Filters",
"title": "Submit",
"data": {
"filters": [
{
"filterName": "Days in Date",
"filterJaql": {
"from": "",
"to": "",
"custom": true
}
}
]
}
}
]
}
Then, make sure to create the required Input field to pass on the input value and populate the from/to:
1
2
3
4
5
6
7
8
9
10
11
12
{
"type": "Input.Date",
"id": "data.filters[0].filterJaql.from",
"placeholder": "yyyy-mm-dd",
"defaultValue": "",
"style": {
"width": "100%"
},
"borderRadius": "4px",
"borderStyle": "none",
"backgroundColor": "#F4F4F8"
}
The "id" should hold the entire path of the key that needs to be populated with the value.
If you prefer you can use this JSON template file for the full script: