Taiga UI 5.0 is out!

InputMonth KIT

Examples API GitHub

On this page

See also

InputDate, InputDateRange, InputDateTime, InputTime
InputMonth = Textfield + CalendarMonth + ❤️

Basic

    
      
    

Form control value

Form control value is TuiMonth or null when empty
    
      
    

Textfield customization

Use all powers of Textfield : put any number of Icons and Tooltips inside (and control their order and color), modify the size of the textbox and etc. Explore Input documentation page for more customization options.
    
      
    

Dropdown customization

    
      
    

Selected value customization

Use [content] of Textfield to customize view of selected value inside textfield .

To switch language inside calendar – read documentation page "Internationalization" .

Mar 26
    
      
    

Native picker

Add type="month" for <input /> to enable built-in browser picker for mobile devices.
Browser support limitations!
Native picker does not have [disabledItemHandler] feature.
Also, we discourage to use [min] / [max] properties with enabled native picker – it has rather limited browser support.
    
      
    

Range mode

Use tuiInputMonthRange to enable possibility to select range of months.

All features described above are applicable for it too. Moreover, it provides two additional features: minLength / maxLength – minimal / maximal length of the selected range.

Form control value is TuiMonthRange or null (for uncompleted range or empty textfield) types.