We are currently working on an app consisting of micro frontends using both React and Angular modules. We use Kendo for both but there's an inconsistency between the Angular and React app when it comes to the TimePicker component. In the Angular version, if the user completes the first section of the TimePicker where we have hours:minutes, after entering 2 characters for the hour field it automatically jumps to the next section without having to press the arrow button. In the React component, once the user completes the first 2 characters for the hours section, the focus doesn't switch to minutes until the user presses the arrow button to manually navigate there.
Is there any possibility to obtain the same functionality for React where the focus automatically changes?
So far I tried both using the reference of the TimePicker component to obtain this behavior and also the solution suggested for the JQuery version where it's recommended to use event listeners and simulate the button press with a dispatched event but none seemed to work.
1 Answer, 1 is accepted
Hello, Alexandru,
Previously the Date Inputs had auto-switching of the segments on typing, but this feature led to many issues where the results of typing numbers did not match the expectations of end-users that were using different cultures and formats, and we ended up removing this.
For more information on why the DateInputs behave the way they do now can be found in the following discussion:
Currently, the only suggestion I can give would be to render the Input component with `type=time` where the next field is focused when typing:
Please let me know if you have any further questions on this matter.
Regards,
Wissam
Progress Telerik
Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!
Rank 1
Hello Wissam!
Thank you for your answer and the proposed solution. I am going to discuss with my team either if we gonna use the Input component with the "time" type or accept the fact that there is going to be this minor difference between the different modules inside the app. :)
Best regards,
Alexandru
