Change or format user input in TextField<BigDecimal> field

Support
#1

Hi,

I want to have a custom TextField component which can change the use input as follows:

  1. Based on a setting, it round up the final field value to the nearest 100.
    e.g. 123456789 => 123,456,800

  2. Convert K to '000, M to '000,000, B to '000,000,000
    e.g. If the user enters 123.4M, the field will change to 123,400,000

How can I pre-process the text/value input into the TextField, before firing the valueChangeEvent and saving the final value ?

Regards,
CK

#3

Hi,

I’d recommend using DataTypes mechanism. Depending on your needs you have 2 options:

  1. Replace default BigDecimalDatatype if you need such behaviour globally for all BigDecimal fields, e.g.:
public class BigDecimalDatatypeExt extends BigDecimalDatatype {

    public BigDecimalDatatypeExt(Element element) {
        super(element);
    }

    @Override
    protected Number parse(String value, NumberFormat format) throws ParseException {
        // custom parsing logic
    }
}

register custom datatype in metadata.xml:

<datatypes>
    <datatype id="decimal" class="com.company.demo.datatype.BigDecimalDatatypeExt"
              default="true"
              format="0.####" decimalSeparator="." groupingSeparator=""/>
</datatypes>
  1. if you need such behaviour for certain fields, you can create a new datatype and assign it to an entity attribute. You can find example in the doc. The rest is the same, you parse String value according to your rules.

Regards,
Gleb