Как сделать валидацию телефона

Добавил пользователь Евгений Кузнецов
Обновлено: 10.09.2024

Доброго времени суток форумчане!
Необходимо создать валидацию email и номера телефона для ASP MVC5 проекта. Email я сделал (приходит ссылка на почту), осталось сделать проверку номера телефона через смс.
Все примеры кода в интернете предлагают использовать сервис twilio мне такой вариант не подходит, может у кого есть примеры, кто сталкивался, может совет полезный есть, подскажите пожалуйста.

Как задать маску для номера мобильного телефона?
Здравствуйте! Скажите, как можно задать маску для номера мобильного телефона в модели или в.

Валидация телефона
Скажите илз как програмно определить правелен ли номер телефона! Ну код телефона можно из GeoIP.

подскажите, пожалуйста, как настроить валидацию телефона в разных карточках(лида, контакта, конртагента, на детали средства связи и тд)?

Соответствие номера телефона правилам маршрутизации можно проконтролировать только при ручном вводе номера пользователем.
Например, при входящем звонке, номер записывается именно тот, который передан с АТС.
При наполнении базы посредством интеграции (например интеграция с Excel) запись происходит напрямую в базу и сервис валидации запустить не представляется возможным

Валидацию телефонных номеров, при внесении заполнении пользователем карточки либо детали можно прописать на сохранение карточки:
Перед сохранением считать требуемое значение поля и проверить, соответствует ли запись правилам маршрутизации (например 10 цифр, первая 9)
Пример реализации Вы можете посмотреть в следующих скриптах:

Привет! Меня зовут Константин Черненко, я инженер в компании Genesis, работаю на проекте BetterMe. Как вы, наверное, знаете, валидация ввода — одна из самых распространенных задач, которую приходится делать в мобильном приложении.

Примерно в 2014 году у нас появился такой инструмент, как RxJava, и мышление Android-инженера начало переход с императивного к реактивному подходу в программировании. Как это связано с валидацией полей? Я думаю, что не открою вам секрет: мы можем интерпретировать события ввода как потоки данных, на которые можно как-нибудь реагировать или как-то ими манипулировать. Кажется, что вы что-то уже подобное слышали, не так ли?

Библиотека RxBinding

Конечно, в этих наших интернетах очень много информации по этому поводу — статьи, библиотеки и ответы на Stack Overflow. Самый распространенный паттерн, который можно встретить, — это использование библиотеки RxBinding (сами знаете кого) и ваше базовое решение может выглядеть следующим образом:

Тут скрыта довольно простая логика. Вы заворачиваете ваши EditText в Observable, объединяете эти потоки данных и слушаете их последние изменения, применяя логику валидации к каждому из них.

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

Плюсы:

Минусы:

  • Если у нас в команде есть UX-специалист или нам самим присущ этот дар, то мы можем заметить, что это решение выглядит ужасно для обычного пользователя. Пользователь открывает экран логина/регистрации и первое, что видит - ошибку ввода на первой строке. Он еще не начал вводить информацию во второе поле, как там сразу же появляется ошибка валидации и т. д.

Конечно же, мы хотим предоставлять нашему пользователю максимально гладкий опыт использования при взаимодействии с необходимыми (нам) полями.

План валидации

Перед тем как начать, давайте составим небольшую карту-план, что нам необходимо сделать, чтобы реализовать максимально дружественную валидацию полей:

  1. Если пользователь открыл экран логина/регистрации, то он не должен видеть никаких ошибок — никакой информации в поля ещё не поступало, поэтому нам не о чем жаловаться.
  2. Если пользователь только начал вводить данные в поле, то мы не должны показывать никакой ошибки. Если покажем, то только зря отвлечем пользователя от процесса ввода (мы вообще должны быть безумно благодарными, что пользователь доверяет нашему приложению настолько, что решил поделиться своей персональной информацией с нами).
  3. Пользователь закончил вводить данные в текущее поле и перешел к следующему? Теперь-то мы и должны проверить текущее поле на содержание ошибок.
  4. Пользователь вернулся на поле, которое содержит ошибку и начал её исправлять? Мы должны скрыть ошибку, потому что пользователь достаточно умен, и мы не должны надоедать ему этой ошибкой.

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

Реализация

Если вы достаточно внимательно читали план, описанный выше, то, наверное, заметили, что, как инженер, вы должны как-то манипулировать фокусом EditText’а и событиями ввода . Когда наше представление в фокусе, то мы должны отключить для него валидацию. Когда фокус оно потеряло, то проверка должна быть применена и должны быть показаны ошибки (если в этом есть необходимость). Если пользователь вернулся к этому представлению (оно снова в фокусе) и начал исправлять ошибку (представление получает события ввода), то мы должны скрыть ошибку.

Давайте посмотрим библиотеку RxBinding и попробуем найти методы, которые помогут решить эту задачу.

В первую очередь, там есть метод focusChanges(View view) , который находится в классе RxView . Его предназначение, как несложно догадаться, — наблюдение за событиями фокуса. Если вы сейчас попробуете использовать этот метод, то заметите, что вы получите ивент фокуса моментально, и это будет нарушением нашего правила в плане, который мы составили выше. В библиотеке RxBinding есть метод skipInitialValue() , который позволит нам пропустить этот первый ивент во время подписки.

Теперь мы должны применять логику валидации, когда наш EditText теряет фокус. Тут нам поможет обычный map() , используя который мы можем определить момент, когда наше представление потеряло фокус, и выполнить блок валидации (лямбда-выражение, потому что, конечно же, каждое поле может иметь свой вид проверки).

Теперь нам необходимо решить пункт из нашего плана. Мы должны прятать ошибку, когда пользователь вернулся к полю и начал исправлять ошибку. Для этого нам необходимо передать ссылку на TextInputLayout и слушать изменения текста. Библиотека RxBinding предоставляет метод textChanges(View view) , который находится в классе RxTextView . Также в то время, как пользователь набирает текст, нам необходимо:

Поэтому обновлённая версия нашего метода validateInput может выглядеть следующим образом:

В Kotlin, если функция принимает лямбда-выражение, то можно её пометить как inline , чтобы её тело было скопировано в место вызова. Поэтому полное решение может выглядеть так:

Давайте посмотрим на валидацию ввода, которую мы сейчас реализовали:

На полную реализацию:

Выводы

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

Специальное поле, упрощающее ввод телефонного номера.

Когда использовать

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

Для ввода номеров телефона без форматирования можно использовать обычное поле ввода.


Описание работы

Поле для ввода телефона — это частный случай поля с маской, с двумя отличиями:

Размер и расположение

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

Рекомендуемая ширина поля — 160 px.

Фокус и работа с клавиатурой

При клике по полю и при переходе табом поле выглядит одинаково: появляется синяя рамка и, если поле не заполнено — маска, которые сохраняются до потери фокуса.

Валидация

Если пользователь ввел недостаточно цифр, при потере фокуса нужно показать валидацию.

Читайте также: