currencySymbol

Параметр currencySymbol в AutoNumeric определяет строковый символ валюты, который отображается рядом с числовым значением и участвует в форматировании денежного представления данных в input-полях и HTML-элементах. Этот параметр работает совместно с правилами позиционирования, пробелами, отрицательными значениями и режимами отображения, формируя итоговый визуальный формат числа.

currencySymbol представляет собой строку, которая добавляется к числу без изменения его внутреннего значения. AutoNumeric хранит «чистое» число отдельно от форматированного представления, поэтому символ валюты влияет только на отображение.

Типичные значения:

  • $
  • €
  • £
  • ¥
  • ₸
  • произвольные строки: USD, EUR, KZT

Пример инициализации:

new AutoNumeric('#price', {
    currencySymbol: '₸'
});

В результате значение 15000 будет отображено как:

₸ 15 000

Взаимодействие с позиционированием currencySymbolPlacement

Отображение символа валюты определяется параметром currencySymbolPlacement, который задаёт его расположение относительно числа.

Доступные варианты:

  • p — префикс (слева)
  • s — суффикс (справа)

Префиксное размещение

new AutoNumeric('#price', {
    currencySymbol: '$',
    currencySymbolPlacement: 'p'
});

Результат:

$ 1,200.50

Суффиксное размещение

new AutoNumeric('#price', {
    currencySymbol: '€',
    currencySymbolPlacement: 's'
});

Результат:

1 200,50 €

Суффиксное размещение часто используется в локализациях, где валютный знак принято ставить после числа.

Пробел между символом и числом

Поведение пробела регулируется параметром currencySymbolSpacing.

new AutoNumeric('#price', {
    currencySymbol: '€',
    currencySymbolPlacement: 'p',
    currencySymbolSpacing: true
});

Результат:

€ 1 000

При отключении:

currencySymbolSpacing: false

Результат:

€1 000

Этот параметр влияет только на визуальное разделение, не затрагивая числовую часть.

Комбинация с разделителями групп

currencySymbol отображается совместно с форматированием тысячных разрядов, задаваемым digitGroupSeparator.

new AutoNumeric('#price', {
    currencySymbol: '₸',
    digitGroupSeparator: ' ',
    decimalCharacter: ',',
    decimalPlaces: 2
});

Ввод:

1523456.7

Отображение:

₸ 1 523 456,70

Символ валюты всегда располагается вне группировки числа и не участвует в разделении разрядов.

Поведение при отрицательных значениях

При отрицательных числах символ валюты сохраняет свою позицию, а знак минус управляется отдельно через параметры отрицательного отображения.

new AutoNumeric('#price', {
    currencySymbol: '$',
    currencySymbolPlacement: 'p'
});

Ввод:

-1200

Отображение:

-$ 1,200

Альтернативный формат (в зависимости от настроек negativePositiveSignPlacement) может изменять порядок знака и символа валюты.

Совместимость с режимами очистки и фокуса

AutoNumeric изменяет поведение отображения символа валюты при фокусе на поле ввода, если активированы параметры:

  • showOnlyNumbersOnFocus
  • selectOnFocus
  • caretPositionOnFocus

Пример:

new AutoNumeric('#price', {
    currencySymbol: '€',
    currencySymbolPlacement: 's',
    showOnlyNumbersOnFocus: true
});

При фокусе может отображаться только числовая часть:

1200,50

При потере фокуса:

1 200,50 €

Символ валюты временно скрывается, но не удаляется из модели данных.

Использование в международных форматах

currencySymbol часто применяется для локализации интерфейсов, где требуется динамическое переключение валют.

Пример переключения:

const anElement = new AutoNumeric('#price', {
    currencySymbol: 'USD',
    currencySymbolPlacement: 'p'
});

// смена валюты
anElement.update({
    currencySymbol: 'EUR'
});

Внутреннее значение числа остаётся неизменным, изменяется только отображение.

Особенности отображения при пустом значении

При отсутствии числа поведение символа валюты зависит от конфигурации:

  • может отображаться самостоятельно
  • может скрываться до ввода значения

Пример:

new AutoNumeric('#price', {
    currencySymbol: '$',
    emptyInputBehavior: 'focus'
});

В состоянии пустого поля символ не выводится до начала ввода.

Ограничения и особенности формата

currencySymbol не участвует в:

  • математических вычислениях
  • парсинге числового значения
  • валидации числа

Он является исключительно визуальным слоем над числовой моделью AutoNumeric.

При получении значения через API:

anElement.getNumber();

возвращается:

1200.5

без символа валюты.

При:

anElement.getFormatted();

возвращается строка с учётом currencySymbol.

Динамическое обновление параметра

Символ валюты может изменяться без переинициализации экземпляра:

anElement.update({
    currencySymbol: '₸',
    currencySymbolPlacement: 'p'
});

Изменения применяются мгновенно ко всем текущим отображаемым значениям.

Влияние на пользовательский ввод

При вводе символ валюты:

  • не редактируется вручную
  • автоматически восстанавливается после форматирования
  • игнорируется при парсинге пользовательского ввода

Если пользователь пытается ввести символ валюты, он отфильтровывается на этапе обработки input-события.

Типичные сценарии использования

  • финансовые формы
  • бухгалтерские интерфейсы
  • отображение цен в e-commerce
  • отчётные панели
  • системы учёта бюджета

Во всех случаях currencySymbol служит исключительно визуальным идентификатором валюты, отделённым от числовой логики AutoNumeric.

Оглавление