[InputMask React] Problem with copy + paste in masked input
Question
Forge component by João Barata

Hello,


I'm using the MaskCurrency for decimal masks and I have encountered an issue when trying to paste values in the masked field. It seems the pasted values are not correctly recognized, they are masked correctly, but when I look in the variable behind the input it remains empty (or previous value). This causes some errors when trying to reset / filter based on this variables.


I also tried (but unsuccessfully) to remove onpaste event in the input field, but again, it seems some javascript from the mask overrides the possibility to remove this event from the input.


Please let me know if there is something I can do to tackle this issue.


Regards,

Bogdan

I am also experiencing this issue - did you ever find a solution Bogdan?

Hi guys, are you still experiencing this in the latest version of the inputMask?

I had done some improvements to the copy/paste experience.

Let me know what are the input masks settings used on the component and what value are you trying to paste.

Regards,

Updating to the most recent version did solve this - thanks João!

Which is the latest version do we have to update to overcome this issue?

We have version 1.02

Hi joão.

I had the same issue and the version 1.02 resolves my problems for integers, but for decimal numbers still have the same problem. i notice if change decimal part the "copy paste" start working, but if i change the integer part doesn't. I always need change decimal part in order to make it work.

@João Barata, I am using inputmask 1.03. work with datetime. the copy paste does not trigger on change event. 



Hi @LingJie Zhou,

Thank you for, reporting it.

I've just released version 1.0.4 that should have the issue with pasting date masks fixed.

Regards,

Thank you for quick update. I have attach my demo . When I copy to the masked date input, the onchange event does not triggered. and when I move the focus out , the onblue does not pickup the new value. 

That cause the UI and real value different. 

Please advice how to solve the problem . Thanks

InputMaskcopypaste.oml

Hi @LingJie Zhou,

I've changed your sample slightly and as you can see by the GIF below the onChange event is being triggered when you click outside of the input ( blur event) although you don't need to specify the onBlur event as it might mess up the blur event from the component

Using the cut command( ctrl+x ) does not copy the correct value. You will need to copy(ctrl+c), clear the input, and then paste (ctrl+v).

I've attached your example with the changes I did.

Hope this helps,

InputMaskcopypaste.oml

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.