Can I use keyboard events to type digits into the DatePicker component?

1 Answer 36 Views
DatePicker
Thomas
Top achievements
Rank 1
Iron
Thomas asked on 04 Sep 2024, 08:36 PM
Currently, I am using a KeyboardEvent to programmatically press the right arrow inside of a DatePicker component.

This example works as expected:


I don't seem to be able to use KeyboardEvents to input numbers into the DatePicker. This example fails:


What is the correct way to programmatically type digits into a DatePicker?

1 Answer, 1 is accepted

Sort by
0
Stoyan
Telerik team
answered on 06 Sep 2024, 06:44 AM

Hi Thomas,

Thanks for the provided information and code snippets.

To achieve the desired behaviour, the DatePicker component allows the developer to plug into the DateInput and provide a custom one. This being said, from there the developer can add custom event listeners / dispatches to the DateInput and manipulate its behaviour.

I've created a short StackBlitz demo which demonstrates the said above. In it, when the DatePicker is focused, if you click 1 (keyCode 49) the DatePicker will get new Date() as its new value

https://stackblitz.com/edit/react-eppc8n?file=app%2Fapp.jsx

I hope this information helps.

Regards,
Stoyan
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
DatePicker
Asked by
Thomas
Top achievements
Rank 1
Iron
Answers by
Stoyan
Telerik team
Share this question
or