How to get IMask to work with new m3 Textbox

Anvil Q&A
1

Hi all,

I’m trying to get IMask [Input Mask Guide | imaskjs] to work with the new m3 textbox (like they did here: Possible to display textbox tel type as (999)999-9999? - Anvil Q&A - Anvil Community Forum). Works fine on the older textboxes, but since the m3 texbox element does not have a .value property, it does not work…

Here is a clone link to a minimal example that shows it working on the old textbox, but not on the m3 textbox.

Any pointers would be appreciated, thanks.

1 Like
2

I would love something like this for percentages and dollar amounts!

3

Yup, this library does exactly that :slight_smile: Now just to get it to work is the challenge!

4

Hi @Neeeco,

You can get this to work by targeting the right dom node. Because the HTML structure of the M3 TextBox is different, it doesn’t work in the same way as the old TextBox.

Using _el = self.with_masking_textbox.dom_nodes['anvil-m3-textbox'] instead should work!

2 Likes
5

Work’s great! Thanks @brooke

2 Likes