Как убирать disabled после ввода 18 символов в input через IMask?

Question

[Sanzhar Bazarbek]

Нужно убрать атрибут disabled после ввода 18-го символа. Думаю, что проблема из-за lazy: false
Но, как это исправить?
https://jsfiddle.net/kbw0erLu/1/

Comments

[Sanzhar Bazarbek]

Проблема заключается в lazy: false
Он думает, что это уже введенные цифры
Как это обойти?

[Alex]

Не используйте disabled на кнопке отправки. Это распространённая ошибка. Кнопка должны быть активна всегда. И по клику должны подсвечиваться невалидные поля и перемещать фокус на первое такое поле.
Уберите весь ваш JS и изучите как работает нативная валидация: https://jsfiddle.net/40ukqjn1/
Если нативная валидация по каким-то причинам вам не подходит и вы хотите делать свою, вы должны максимально приблизится к нативному поведению.

Upd.
В довесок, я считаю, что заморачиваться как либо с масками для текстовых полей зачастую -- только вредит UX. Намного лучше, оставлять поле как есть и позволить пользователю вводить данные как он хочет, а уже потом, самостоятельно форматировать и очищать введённые данные перед сохранением. Например для номера телефона:

[phone] -> 77000000000
7 (700) 000 00 00 -> 77000000000
[phone] -> 77000000000
[phone] -> 77000000000
7000000000 -> 77000000000

Answer 1

[0xD34F]

phoneDisabled.addEventListener('input', function() {
  buttonDisabled.disabled = phoneMask.unmaskedValue.length !== 11;
});

Answer 2

[Алексей Уколов]

Решение простое: сделать lazy = true и добавить инпуту placeholder.
Решение грубое: let length = this.value.split('_').join('').length

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