InputDateTime LEGACY

Examples API Setup
Source code
See also
InputDate, InputDateRange, InputMonth, InputMonthRange, InputTime
InputDateTime allows to input date and time

Date formatting can be customized with TUI_DATE_FORMAT token.

See example with the usage of these tokens.

DI-tokens for input-configurations:

TUI_DATE_TIME_VALUE_TRANSFORMER
custom format of control output ( [TuiDay | null, TuiTime | null] is default).

See example with string as control's output.

Basic

#
If you need to set some attributes or listen to events on native input , you can put it inside with Textfield directive as shown below

Form value:

{
  "testValue": [
    "2017-03-15",
    null
  ]
}

Modes

#

Default:

With seconds:

With SS and MS:

Form value:

{
  "testValue": [
    "2017-03-15",
    null
  ]
}

Date localization

#

With control's output as string

#

Stringified control value:

19.01.2022, 12:33

Native input datetime

#
Please note that native input datetime only supports HH:MM time mode

AM / PM

#

Any timeMode ending with AA is 12-hour time format with meridiem part

Control value:

[
  "2020-09-20",
  {
    "hours": 15,
    "minutes": 30,
    "seconds": 0,
    "ms": 0
  }
]