Date Picker

Click to copy

Allows to select a certain date.


Look and Feel Settings

Label (not mandatory) to be used to show the component's label.

Placeholder (not mandatory) to be used to show the component's placeholder.

Name (mandatory) - name of the component.

Tooltip (not mandatory) - tooltip string.

Min (mandatory) - minimum timestamp value [unix formatted] to start from. Is set to 0 by default. 

Max (mandatory) - maximum timestamp value [unix formatted] which can be selected. Equivavalent to the moment of creation by default.;

Step (not mandatory) - selection step value.

Required (mandatory) - marks if the selection required or not. Is set to false by default.

Allow clear (mandatory) - allows clear on selection. Is set to false by default. 

Disabled (mandatory) - makes the component disabled if turned on. Is turned off by default.

Visible (mandatory) - makes the component visible if turned on. Enabled by default.


Workflow triggers

  • onChange - fires when the dropdown option is changed.
  • onFocus - fires when the component is being focused on.
  • onBlur - fires when the component is blurred.
  • onCreate - fires when the component is created.
  • onShow - fires when the component is shown.
  • onHide - fires when the component is hidden.
  • onDestroy - fires when the component is shown.
  • onEnterKey - fires when the Enter key is pressed.

Component Actions

Datepicker Get Properties

Gets the component's properties.

Input parameters:

  • Component Id [string] - component's identifier;

Output parameters:

  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Min [datetime] - minimum timestamp value [unix formatted] to start from;
  • Max [datetime] - maximum timestamp value [unix formatted] which can be selected;
  • Value [datetime] - selected timestamp value [unix formatted];
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value;

Datapicker Get Properties

Datepicker Set Properties

Sets the component's properties.

Input parameters:

  • Component Id [string] - component's identifier;
  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Min [datetime] - minimum timestamp value [unix formatted] to start from;
  • Max [datetime] - maximum timestamp value [unix formatted] which can be selected;
  • Value [datetime] - selected timestamp value [unix formatted];
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value;

Datapicker Set Properties

Datepicker Update Properties

Updates component's properties.

Input parameters:

  • Component Id [string] - component's identifier;
  • Label [string] - component's label;
  • Placeholder [string] - component's placeholder;
  • Allow Clear [boolean] - allows clear the selection if true;
  • Disable [boolean] - disables component if true;
  • Tooltip [string] - tooltip string;
  • Required [boolean] - shows required mark if true;
  • Debounce (ms) [integer] - delay to validate the value;
  • Min [datetime] - minimum timestamp value [unix formatted] to start from;
  • Max [datetime] - maximum timestamp value [unix formatted] which can be selected;
  • Value [datetime] - selected timestamp value [unix formatted];
  • Validate Icon [boolean] - icon to be shown on validate the value;
  • Validate Status [Status type] - status to be shown on validate the value; 
  • Validate Message [string] - message to be shown on validate the value;

Datapicker Update Properties

Datepicker Validate

Validates the selected timestamp value from the DateTime Picker component.

Input parameters:

  • Component Id [string] - component's identifier;

Output parameters:

  • Success [boolean] - validation result;
  • Error [string] - error message;

Datapicker Validate


Usage example

Date can be divided into some different parts like years, months and days.

  • Drag the Datepicker Get Properties block and drop it into the canvas. Component ID has to be specified in order to get the value from the Date Picker component

  • The selected value can be divided into some minor parts, like years, months and days. Expand date has to be used.