[Solved] DatePicker manual input

[Pablo]

When a user starts typing a data manually into Datepicker as below:

 

<DatePicker
 ariaLabelledBy={labelId}
 ariaDescribedBy={`${hintId} ${errorId}`}
 valid={valid}
 id={id}
 disabled={disabled}
 min={MIN_DATE}
 {...others}
 format="dd-MM-yyyy"
/>

The user starts typing and it auto completes on each stroke and when it reaches year it autocompletes at the first digit. meaning if you want to enter e.g. 2026, you get 0002 and it triggers an onChage. The only way I found to remedy this is to change format to 

"dd-MM-yyyy HH:mm"

[Martin Bechev]

Hello Pablo,

Thank you for the provided details for this case. The DatePicker automatically switches between date segments by default.

As a workaround, keep the year segment active until all four digits are entered by setting autoSwitchParts to false.

With this setting, the input does not move automatically to the next segment. Use the date separator or the arrow keys to move between the day, month, and year segments after completing each part.

https://www.telerik.com/kendo-react-ui/components/dateinputs/dateinput/typing

Please check it out and let me know if I misunderstand someting or any follow up questions arise.

Regards,
Martin Bechev
Progress Telerik