Add proper data-bolt-format-input
to the form-input.twig
attributes object in order to autoformat a given value into input field. For example:
'data-bolt-format-input': 'percent'
for percentage autoformatting.'data-bolt-format-input': 'currency-us'
for dollar autoformatting.'data-bolt-format-input': 'currency-ja'
for yen autoformatting.'data-bolt-format-input': 'number'
for number autoformatting.{% set form_children %}
{% set for_value = 'percent' %}
{% set label %}
{% include '@bolt-components-form/form-label.twig' with {
title: 'Example of percent auto formatting (add attribute \'data-bolt-format-input="percent"\')',
attributes: {
for: for_value
},
displayType: 'block'
} only %}
{% endset %}
{% set input %}
{% include '@bolt-components-form/form-input.twig' with {
attributes: {
placeholder: 'E.g. 10',
required: true,
type: 'number',
id: for_value,
'data-bolt-format-input': 'percent',
min: 0,
max: 100
},
} only %}
{% endset %}
{% include '@bolt-components-form/form-element.twig' with {
labelDisplay: 'before',
label: label,
children: input
} only %}
{% endset %}
{% include '@bolt-components-form/form.twig' with {
children: form_children
} only %}