Skip to content

TimePicker

TimePicker element is an input for selecting a time. It allows users to pick a time from a time picker interface.

time-picker

Options

TimePicker does not have any options.

Build-in Validators

Element validates if given value is a time in format HH:MM:SS.

Available Validators

Element does not have any available validators.

Relations Support

Element does not support relations between elements.

Configuration output schema

schema
{
  "<element_type>" : "timePicker",
  "<element_name>" : string,
  "<element_label>" : string,
  "<element_labelDescription>" : string,
  "<element_isRequired>" : bool,
  "<element_isHidden>" : bool,
  "<element_defaultValue>" : string
}
example
{
  "type" : "timePicker",
  "name" : "time",
  "label" : "Opening time",
  "labelDescription" : "Select the opening time",
  "isRequired" : true,
  "isHidden" : false,
  "defaultValue" : "09:00:00"
}

Element value

Element value is a string with format HH:MM:SS.

usage in module TWIG
<div>
  <b>time</b><p>{{ moduleConfig.time }}</p>
</div>

Example of module

Twig

Twig
<div>
  <b>time</b><p>{{ moduleConfig.time }}</p>
</div>

JSON configuration

JSON configuration
[
  {
    "label": "EXAMPLE",
    "state": "unfolded",
    "elements": [
      {
        "name": "time",
        "type": "timePicker",
        "hint": "Select date and time for the event",
        "label": "Event date and time",
        "labelDescription": "Select date and time for the event",
        "isRequired": true,
        "defaultValue": "14:30:00"
      }
    ]
  }
]