removeMaskOnSubmit

Опция removeMaskOnSubmit в библиотеке Inputmask определяет, каким образом значение поля будет представлено в момент отправки формы: сохраняется ли маска или из значения удаляются все символы форматирования.

Основная задача параметра — управление тем, что именно попадёт в FormData, сериализацию формы или отправку через стандартный submit.

При значении false (поведение по умолчанию) в форму отправляется значение вместе с маской. При значении true маска удаляется, и на сервер уходит «чистое» значение без форматирующих символов.

Базовая семантика значения

Маска в Inputmask — это визуальный слой, который помогает пользователю вводить данные в заданном формате (телефон, дата, номер карты). Однако фактическое значение может отличаться от отображаемого.

Опция removeMaskOnSubmit влияет только на момент отправки формы и не меняет поведение поля во время ввода.

Поведение можно описать следующим образом:

removeMaskOnSubmit: false — отправляется отформатированное значение
removeMaskOnSubmit: true — отправляется «сырое» значение без маски

Влияние на значение input

Важно различать два состояния значения поля:

Отображаемое значение (input.value) — всегда может содержать маску
Неотформатированное значение (inputmask.unmaskedvalue()) — чистые данные без служебных символов

removeMaskOnSubmit не меняет input.value до отправки. Изменение происходит только в момент сериализации формы.

Это означает, что UI остаётся неизменным, но итоговый payload может отличаться.

Поведение при submit формы

При стандартной отправке формы Inputmask перехватывает событие submit и трансформирует значения input-полей согласно настройке.

Сценарий с отключённым удалением маски

Inputmask("+7 (999) 999-99-99", {
  removeMaskOnSubmit: false
}).mask(document.querySelector("#phone"));

Отправляемое значение:

+7 (777) 123-45-67

Формат сохраняется полностью, включая скобки, пробелы и дефисы.

Сценарий с включённым удалением маски

Inputmask("+7 (999) 999-99-99", {
  removeMaskOnSubmit: true
}).mask(document.querySelector("#phone"));

Отправляемое значение:

+77771234567

Символы форматирования исключаются, остаётся только значимая часть строки.

Отличие от unmaskedvalue()

Часто возникает путаница между removeMaskOnSubmit и методом unmaskedvalue().

Метод:

inputmask.unmaskedvalue()

возвращает чистое значение в любой момент времени.

removeMaskOnSubmit работает иначе:

применяется только при отправке формы
не влияет на runtime-значение
не требует ручного вызова
интегрируется с HTML form submit

Таким образом:

Механизм	Когда применяется	Что возвращает
unmaskedvalue()	вручную	чистое значение
removeMaskOnSubmit	при submit	чистое значение
input.value	всегда	значение с маской (если не изменено вручную)

Влияние на сериализацию формы

При использовании FormData или serialize() (jQuery) Inputmask перехватывает момент формирования данных.

Пример:

const formData = new FormData(document.querySelector("form"));

Если removeMaskOnSubmit: true, то в FormData попадёт уже очищенное значение.

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

Поведение при динамическом изменении настроек

Настройка removeMaskOnSubmit фиксируется в момент инициализации маски. Изменение объекта настроек после применения маски не всегда влияет на уже инициализированные поля.

Корректный способ изменения поведения:

const el = document.querySelector("#phone");

Inputmask("999-999", {
  removeMaskOnSubmit: true
}).mask(el);

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

Влияние на различные типы масок

Числовые маски

Для числовых значений (например, суммы):

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

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

Пример:

1 234 567,89 ₽ → 1234567,89

Даты

Для дат:

ДД.ММ.ГГГГ

При удалении маски остаются только цифры:

12.05.2026 → 12052026

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

Телефонные номера

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

+7 (777) 123-45-67 → +77771234567

Это наиболее типичный сценарий использования removeMaskOnSubmit.

Взаимодействие с автокомплитом и браузером

Браузерные механизмы автозаполнения могут вмешиваться в значение input перед submit. Inputmask повторно нормализует значение перед отправкой, если включён removeMaskOnSubmit.

Однако в сложных случаях (особенно при динамическом заполнении) возможно несоответствие между отображаемым и отправляемым значением до момента финальной обработки формы.

Использование с disabled и readonly

Если поле:

disabled — оно не попадает в submit вообще, независимо от настройки
readonly — участвует в submit, и removeMaskOnSubmit применяется стандартно

Это важно при формировании форм с частично заблокированными полями.

Поведение при программной отправке

При отправке формы через Jav * aScript:

form.submit();

или через клик по submit-кнопке, Inputmask всё равно перехватывает событие, если маска активна на поле.

Однако при обходе стандартного submit (например, ручная сборка JSON) removeMaskOnSubmit не применяется автоматически.

Пример:

const value = document.querySelector("#phone").value;

В этом случае значение остаётся с маской, даже если removeMaskOnSubmit: true.

Совместимость с другими опциями Inputmask

clearMaskOnLostFocus

removeMaskOnSubmit работает независимо от clearMaskOnLostFocus.

первый влияет на submit
второй — на blur (потерю фокуса)

autoUnmask

Схожая по смыслу опция, но отличается по механике:

autoUnmask: true — значение автоматически хранится без маски
removeMaskOnSubmit: true — преобразование происходит только при отправке

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

greedy и другие опции

Опции типа greedy, placeholder, showMaskOnHover не влияют на removeMaskOnSubmit, так как относятся только к отображению.

Типовые ошибки при использовании

Ожидание изменения input.value

Распространённое заблуждение — ожидание, что input.value изменится после submit. На практике изменение происходит только в передаваемом значении.

Двойная очистка данных

При использовании одновременно:

removeMaskOnSubmit: true
ручной вызов unmaskedvalue()

может возникать двойная обработка данных на стороне приложения.

Несоответствие серверной логики

Сервер, ожидающий форматированные данные (например, с дефисами), может некорректно обработать очищенные значения. Поэтому выбор значения параметра должен согласовываться с контрактом API.

Поведение в нестандартных сценариях

Отправка через AJAX с сериализацией вручную

При использовании:

$.ajax({
  data: $("#form").serialize()
});

Inputmask вмешивается только если сериализация использует DOM значения. При кастомной сборке объекта JSON необходимо самостоятельно учитывать необходимость очистки.

Динамически добавленные поля

Если input добавляется в DOM после инициализации формы, маска должна быть применена явно. Иначе removeMaskOnSubmit не будет учитывать новое поле.

Логика работы внутри Inputmask

Внутренне Inputmask при submit выполняет следующий порядок действий:

Перехват события submit
Проверка активных масок на input
Определение режима removeMaskOnSubmit
Преобразование значения при необходимости
Передача формы дальше в стандартный обработчик браузера

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