TextField Formatter
Cleave.js based client-side text formatter for Vaadin 8 and Vaadin 14
A TextField formatter extension built on top Cleave.js. Supports credit card formatting, numeral fields, dates and custom blocks e.g. IBAN.
Version 2.x is for Vaadin 8 and 4.x+ is for Vaadin 14.
Sample code
TextField textField = new TextField(); new PhoneI18nFieldFormatter( PhoneI18nFieldFormatter.GE).extend(textField); // Vaadin 14 new PhoneFieldFormatter( "LU").extend(textField); // Vaadin 8
TextField textField = new TextField(); new NumeralFieldFormatter(",", ".", 3).extend(textField);
TextField textField = new TextField(); CreditCardFieldFormatter formatter = new CreditCardFieldFormatter(); formatter.addCreditCardChangedListener(e -> { // Any custom behavior based on the event e.getCreditCardType(); }); formatter.extend(textField);
TextField myDateField = new TextField(); new DateFieldFormatter.Builder() .datePattern("yyyyMMdd") .delimiter("-") .dateMin(LocalDate.of(1900, 01, 01)) .dateMax(LocalDate.of(2019, 9, 3)) .build().extend(myDateField); // or TextField myDateField = new TextField(); new DateFieldFormatter( "yyyyMMdd", LocalDate.of(1900, 01, 01), LocalDate.of(2019, 9, 3), "-" ).extend(myDateField);
TextField tf = new TextField(); IBANFormatter.fromIBANLength(18).extend(tf);
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
Fixed an issue that prevented the add-on from working in Vaadin 24.
- Released
- 2023-10-04
- Maturity
- EXPERIMENTAL
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 23
- Vaadin 24
- Vaadin 24.1
- Vaadin 24.2
- Vaadin 8.0+ in 1.0
- Vaadin 14+ in 4.0.0.beta3
- Vaadin 14 in 4.1.4
- Browser
- N/A
TextField Formatter - Vaadin Add-on Directory
Cleave.js based client-side text formatter for Vaadin 8 and Vaadin 14A TextField formatter extension built on top [Cleave.js](https://nosir.github.io/cleave.js/).
Supports credit card formatting, numeral fields, dates and custom blocks e.g. IBAN.
Version 2.x is for Vaadin 8 and 4.x+ is for Vaadin 14.
[Vaadin 8 demo](http://johku.app.fi/textfieldformatter)