DatePicker Pattern

The DatePicker pattern provides you with a date and time picker with a flat UI to display inline on the screen. It can receive lists of dates with events and it enables you have a selection within a range of days. The DatePicker was created using the Pikaday.js
library .

You can use this pattern to display a list of elements side by side, with a different number of items per row on different devices.

How to Use the DatePicker Pattern

Use static data or a List widget inside this block to display items in a gallery pattern.

1. Upon dragging the DatePicker to the page, you'll be prompted to create an
event.

2. To have access to the picked date, you need to create an assign to the
startDate (if SelectInterval is False ).

3. Set the default value of the variable PickedDate as CurrDateTime().

Result:

Listing Events of a Selected Day

1. Set the area where you want to put the list of events.

2. Create an entity with a DateTime attribute.

3. Set the entity in your EventList parameter on eventList, using the
right attribute to map.

4. Add the list to the page.

5. Create a Local Variable.

6. Get another Aggregate for the Events and set a filter on the aggregate:
DateTimeToDate(Events.DateTime) = Date

Result:

Input Parameters

Input Name

Description

Default Value

EventList

Receives a List of DateTime records that are used to highlight days as event days.

none

MinDate

Days before this date will be disabled.

none

MaxDate

Days after this date will be disabled.

none

InitialDate

The initially selected day for the DatePicker. If not set, it will be the current day by default.