I have a text attribute that accepts no more than 11 characters. I have validation in place to ensure the accepted text is exactly 11 characters (no more, no less) and that all the characters are numeric. However, when users are inputting this text, it would be helpful if my input control formatted their input. Here are a few examples of what I am needing:
The control is simply an "input" widget, which, matching the database attribute restriction, has a Max. Length property of 11 (thus preventing a user from, say, typing in the input seen in my second example). I have seen this Forge component, but I am wanting to verify that there really is no other way to achieve this without an extra asset. If this sort of behavior does require a Forge component, I am open to additional recommendations.
Thank you!
Hi Jared,
There is no other way to format input while the user types than using either a Forge asset or creating something yourself using JavaScript. Standard web technologies have no provision for masked input, unfortunately.
Thanks for confirming. I ended up using InputMask React: https://www.outsystems.com/forge/component-documentation/7838/inputmask-react/0.
The only inelegant aspect of the solution is that my input control needs to have a specified Max. Length of 13, while the underlying database attribute I'm keeping to 11. I used a MaskPattern of "9{2}\-9{3}\-9{6}" to achieve the result seen in my question.