864
Views
5
Comments
Solved
[input mask react] How to set up Input Mask for reactive apps

I'm trying to work with the input mask component but I'm not sure i'm including it into my app properly. I added the library as a reference to my module, created a web block with my input field and added the source block and input id for the input widget. Is there something else I'm suppose to do after this? Upon publishing this is my result 


ScreenShot20201214at6.12.26PM.png
2020-05-07 18-53-00
Rui Barradas
 
MVP
Solution

Hello Ashley,

Hope you're doing well.

About that component, I'm assuming that you're trying to use InputMask React, right?

You can install a Demo of that component, in order to see how you should implement it:


You can just install the Demo in your environment and it should help you to see how it works :)


Hope that this helps you!


Kind regards,

Rui Barradas

UserImage.jpg
Ashley Madera

This works great! Thank you Rui!

2021-07-14 09-27-33
Luís Cardoso

Hello Ashley,

Can you try to use this component Input Mask Reactive ?

Hope it helps you.


BR,

Luís

UserImage.jpg
Ashley Madera

Thank you for the resource! Do you happen to know of any tutorials that show you how to implement this as an installed component within Outsystems? 

My question is specifically to where to implement this into outsystems outside of the steps I've already followed with the components added as a reference through outsystems service studio.  

Am I implementing this into a javascript node attached to, say, a inputonchange action? By install via npm, is this globally working through outsystems? 

Thank you

2020-05-07 18-53-00
Rui Barradas
 
MVP
Solution

Hello Ashley,

Hope you're doing well.

About that component, I'm assuming that you're trying to use InputMask React, right?

You can install a Demo of that component, in order to see how you should implement it:


You can just install the Demo in your environment and it should help you to see how it works :)


Hope that this helps you!


Kind regards,

Rui Barradas

UserImage.jpg
Ashley Madera

This works great! Thank you Rui!

UserImage.jpg
Larry Tay

how do i use this input date mask with a date widget ?  If i use this input mask, i lost the date widget date pop-up to select calendar dates. but at the same time, i would like this input mask to work on dd/mm/yyyy format.

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