search

primefaces / primereact

The Most Complete React UI Component Library
https://primereact.org
MIT License
6.9k stars 1.05k forks source link

Calendar mask with timeOnly cursor issue #4928

Open augustosnk12 opened 1 year ago

augustosnk12 commented 1 year ago

Describe the bug

When I use the maks props in Calendar component and type the value, the position of the input cursor just appear after the second typed value so the first one goes to the end. It happens when the input is already filled with a value and I try to edit it inserting a new one.

Example: current value of input is 12:00 and I want to replace to 13:30. The final result is 33:01 because of the cursor position.

Reproducer

https://codesandbox.io/s/primereact-calendar-mask-cursor-error-yv3n72?file=/src/App.js

PrimeReact version

9.6.2

React version

17.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

The steps are quoted in the codesandbox fork

Expected behavior

No response

melloware commented 1 year ago

@akshayaqburst let me know what you find out. The Calendar with mask has been tricky.

augustosnk12 commented 1 year ago

any update on this?

melloware commented 12 months ago

@augustosnk12 can you confirm this is still an issue with 10.0.9?

TimmTha7er commented 11 months ago

I try to fix it using onChange and onBlur events(commented). It works but it seems like a crutch

Example: CodeSandbox

augustosnk12 commented 11 months ago

Thanks for the reply @TimmTha7er , but there is still some issues in your solution. Example: trying to type "13:30" it returns me "13:03"

TimmTha7er commented 11 months ago

Thanks for the reply @TimmTha7er , but there is still some issues in your solution. Example: trying to type "13:30" it returns me "13:03"

to correct work you need to uncommented onBlur and onChange events

augustosnk12 commented 11 months ago

In version 10.2.1 there is another issue: it is needed to double click input to be able to type

CroAnna commented 9 months ago

Thanks for the reply @TimmTha7er , but there is still some issues in your solution. Example: trying to type "13:30" it returns me "13:03"

How to fix this problem? Is there a solution, a working sandbox, not only a workaround?

TimmTha7er commented 9 months ago

Thanks for the reply @TimmTha7er , but there is still some issues in your solution. Example: trying to type "13:30" it returns me "13:03"

How to fix this problem? Is there a solution, a working sandbox, not only a workaround?

The commented code solves the problem. To correct work you need to uncommented onBlur and onChange events