Masked text fields
ClientSide MaskedTextField
Custom Text Field with client-side masking. Created using https://github.com/RobinHerbots/Inputmask . Supports Swing style masks javax.swing.text.MaskFormatter.
Sample code
MaskedTextField field = new MaskedTextField("####-###-###"); //.setId("...") is important and necessary field.setId("test"); add(field);
new MaskedTextField(mask, allowedChars, containsLiteral, placeholder, MaskType.LAZY, MaskFormat.SWING);
For version 1.0.7 It's needed to put file jquery-loader.js to folder /frontend/src/ with following code: import * as $ from 'jquery'; window.jQuery = $; window.$ = $
Version 1.0.7 is based on CustomTextField. Tested, works well enough, but, unfortunately there are no css. Version 2.0.7 is based on TextField. Works fine, some times some bugs with caret position. Will be fixed ASAP.
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
small npe fixes
- Released
- 2022-07-07
- Maturity
- BETA
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 14+
- Vaadin 14 in 1.0.7
- Browser
- N/A
Masked text fields - Vaadin Add-on Directory
ClientSide MaskedTextFieldCustom Text Field with client-side masking. Created using https://github.com/RobinHerbots/Inputmask . Supports Swing style masks javax.swing.text.MaskFormatter.
View on GitHubMasked text fields version 1.0.7
minor
Masked text fields version 2.0.0
Removed jquery requirement. Now component based on TextField (com.vaadin.flow.component.textfield) due to some integration problems.
Masked text fields version 2.0.1
small npe fixes