InputDateRange LEGACY

Examples API Setup
Source code
See also
InputDate, InputMonth, InputMonthRange, InputDateTime, InputTime

InputDate is a field to input a range of dates.

Date formatting can be customized with TUI_DATE_FORMAT token.

See an example with the usage of these tokens.

DI-tokens for input-configurations:

TUI_DATE_RANGE_VALUE_TRANSFORMER
custom format of control output ( TuiDayRange is default).

See an example of how to provide transformers for InputDate and InputDateRange to work with native Date objects.

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

If a field is optional, but unfinished field should be marked as invalid, use tuiUnfinishedValidator directive

10.03.2018 – 20.04.2018

Big size

#
10.03.2018 – 20.04.2018

Date localization

#
2018/03/10 – 2018/04/20

With native Date output

#
10.03.2018 – 20.04.2018

Stringified control value:

Sat Mar 10 2018 00:00:00 GMT+0000 (Coordinated Universal Time),Fri Apr 20 2018 00:00:00 GMT+0000 (Coordinated Universal Time)

Custom period

#
Today (28.05.2025)