FieldMask

FieldMask is a field that renders an input element that forces its value to be of a certain format.

type mask

inputType text | search | URL | password | tel

FieldMask depends on an external library called maska. This means it has the same features (and limitations) maska has.

Masked example

The value inside the model will reflect the masked value by default.

Code

{
    name: 'creditCardExample',
    label: 'Credit card',
    model: 'creditCard',
    type: 'mask',
    mask: '#### #### #### ####',
    maskOptions: {
      eager: true
    }
}

creditCard:

Credit card

Unmasked example

By passing unmasked: true to the maskOptions inside the field, the model value will reflect the raw value instead of the masked value.

Code

{
    name: 'creditCardExample',
    label: 'Credit card',
    model: 'creditCard',
    type: 'mask',
    mask: '#### #### #### ####',
    maskOptions: {
      eager: true,
      unmasked: true
    }
}

creditCard:

Credit card

Masks, other options and validators

WARNING

Please keep in mind that the model value will be used inside validators. This means if you use the unmasked option, the value that will be validated is unmasked and vice versa.

For more information on masks and options, please refer to maska's documentation.