Отображение при потере фокуса

Поведение поля ввода при потере фокуса в AutoNumeric определяется комбинацией внутренних правил форматирования и конфигурационных параметров, управляющих тем, как числовое значение должно отображаться пользователю в состоянии покоя. Потеря фокуса (blur-состояние) выступает как ключевой момент синхронизации между «чистым» числом и его визуальным представлением, включающим разделители разрядов, символы валют, ограничения по точности и правила отображения пустых значений.

В момент, когда элемент ввода теряет фокус, AutoNumeric выполняет финальную нормализацию значения. Внутреннее числовое представление преобразуется обратно в строку с учетом текущих настроек форматирования. Это включает:

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

Если в процессе редактирования пользователь вводил «сырое» значение (например, без группировки разрядов), то после blur оно всегда приводится к каноническому виду, определенному конфигурацией экземпляра AutoNumeric.

Конфигурационные параметры, влияющие на отображение при потере фокуса

Поведение при blur не является фиксированным и определяется набором опций инициализации.

Разделители и формат числа

Ключевыми параметрами выступают:

  • digitGroupSeparator — символ группировки разрядов (например, пробел или запятая);
  • decimalCharacter — символ десятичного разделителя;
  • decimalPlaces — фиксированное количество знаков после запятой;
  • decimalPlacesRawValue — точность внутреннего представления;
  • minimumValue и maximumValue — ограничения диапазона.

При потере фокуса значение всегда приводится к этим правилам, даже если во время ввода оно временно нарушало формат.

Отображение валютного символа

Параметры:

  • currencySymbol
  • currencySymbolPlacement

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

Поведение пустого значения

Опция emptyInputBehavior играет критическую роль при потере фокуса:

  • null — поле остается пустым;
  • zero — подставляется ноль с форматированием;
  • min или max — подстановка предельных значений;
  • focus — поведение зависит от состояния фокуса, но при blur обычно приводит к нормализации.

Таким образом, даже пустое поле при потере фокуса может быть преобразовано в валидное числовое значение.

Поведение выделения и курсора

Хотя напрямую не относится к blur, параметры:

  • selectOnFocus
  • caretPositionOnFocus

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

Сценарии отображения при потере фокуса

Корректно введенное число

При вводе значения, соответствующего ограничениям, blur приводит его к формату:

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

Пример логики:

  • ввод: 12345.6
  • blur: 12 345.60 (при соответствующей конфигурации)

Частично введенное число

Если пользователь завершил ввод без десятичной части:

  • ввод: 1000
  • blur: 1 000.00

AutoNumeric добавляет недостающие знаки в соответствии с decimalPlaces.

Некорректные промежуточные состояния

Во время редактирования возможны состояния вроде:

  • -
  • 1.
  • 1,

При потере фокуса такие значения преобразуются:

  • одиночный минус → либо 0, либо пусто (в зависимости от emptyInputBehavior)
  • число с незавершенной дробной частью → округляется или дополняется нулями

Влияние округления и точности

При blur всегда используется финальная стратегия округления. Она зависит от внутренней настройки точности и может приводить к изменениям отображаемого значения:

  • банковское округление;
  • округление вверх;
  • округление вниз;
  • фиксированное округление до заданного количества знаков.

Важно, что отображаемое значение после blur может отличаться от введенного символ за символом, поскольку AutoNumeric оперирует числовым типом, а не строкой.

События, связанные с потерей фокуса

AutoNumeric использует как нативное событие blur, так и собственные механизмы обратных вызовов.

onBlur callback

Опция onBlur позволяет перехватывать момент потери фокуса после применения форматирования. В этот момент значение уже приведено к финальному виду.

Типичный порядок действий:

  1. Пользователь покидает поле;
  2. Срабатывает native blur;
  3. AutoNumeric выполняет форматирование;
  4. Вызывается onBlur.

Внутри callback доступно уже нормализованное значение.

Сопутствующие события

Дополнительно могут быть задействованы:

  • onChange — если значение изменилось до blur;
  • onFocusOut (в зависимости от версии и обертки);
  • нативные DOM-события, если AutoNumeric интегрирован без обертки.

Взаимодействие blur с внутренним и отображаемым значением

AutoNumeric всегда хранит два представления:

  • raw value — чистое числовое значение;
  • formatted value — строка, отображаемая в input.

При потере фокуса происходит синхронизация:

  • raw value не изменяется логически;
  • formatted value полностью пересобирается.

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

Программное управление состоянием после blur

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

Примеры операций:

  • получение отформатированного значения;
  • получение «сырого» значения;
  • принудительное обновление отображения.

Логика:

const anElement = AutoNumeric.getAutoNumericElement('#price');

// получить raw value
anElement.getNumber();

// получить formatted value
anElement.getFormatted();

// принудительное обновление отображения
anElement.reformat();

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

Особенности поведения при быстрых переключениях фокуса

При быстром переходе фокус/blur между элементами возможны промежуточные состояния, однако AutoNumeric гарантирует:

  • отсутствие «полуформатированных» значений;
  • завершение всех операций форматирования до завершения события blur;
  • консистентность отображаемого числа.

Это достигается за счет синхронного выполнения форматирования внутри обработчика потери фокуса.

Итоговая модель поведения

Отображение при потере фокуса в AutoNumeric можно описать как детерминированный процесс преобразования внутреннего числового состояния в строго форматированную строку с учетом:

  • правил локализации;
  • ограничений точности;
  • политики обработки пустых и промежуточных значений;
  • валютного оформления;
  • стратегии округления.

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

Оглавление