Как определить, что поле заполнено правильно?

На сайте в поле телефона используется маска телефонного номера "+7 (_) _--". При заполнении поля полностью (например, "+7 (999) 874-47-11") у кнопки отправки формы должен удаляться атрибут "disabled". Как проверить поле на правильное заполнение?

Я пробую определить количество символов, но из-за маски в поле всегда 18 символов.

$(".phone_field").on("keyup input", function() {
        var count = $(this).val().length;
        if (count == 18) {
            $(".js-submit_button").removeClass("disabled");
        } else {
            $(".js-submit_button").addClass("disabled");
        }
    });

Как правильно проверить поле на заполнение?


Ответы (1 шт):

Автор решения: Максим Н Епихин

Если смотреть примитивное решение для такого формата номеров, то можно использовать это выражение ^\+7\s\(\d{3}\)\s{1}\d{3}-{1}\d{2}-{1}\d{2}$ и следующий код:

const regex = /^\+7\s\(\d{3}\)\s{1}\d{3}-{1}\d{2}-{1}\d{2}$/g;

let isPhoneValid = (phone) => {
  return phone.match(regex) !== null;
}

console.log(isPhoneValid('+7 (999) 874-47-11'));
console.log(isPhoneValid('+7 (999) 874-47-112'));

Соответственно, дальше проверяешь на true/false и делаешь уже removeClass/addClass.

→ Ссылка