Валидация номера телефона в формах Onepage (onepage.io) без SMS-подтверждения

Добрый день.

С подобными задачами работал в Webflow, Tilda и других конструкторах, где нет доступа к бэкенду и все решается через клиентскую логику. В вашем случае я бы делал решение через libphonenumber в связке с собственной логикой перехвата submit, а не через простой regex. Для рынка Германии это даст гораздо более точную проверку, особенно с разной длиной номеров.
Могу реализовать нормализацию до E.164 перед отправкой формы и блокировку submit с корректным сообщением на немецком. Поле будет подсвечиваться, ошибка исчезнет после исправления. Если нужно, добавим легкую маску или intl-tel-input без конфликтов со скриптами Onepage.
Стабильность обеспечим через поиск элементов по типу поля и контексту формы, а не по динамическим ID. При необходимости используем MutationObserver, чтобы скрипт корректно “подхватывал” форму даже при асинхронном рендере.
Подскажите, есть ли на странице одна форма или несколько, и есть ли возможность вставить код глобально для всего сайта? Это повлияет на способ привязки.

Показать оригинал

Перевести

Здравствуйте! Меня заинтересовал ваш проект по валидации телефона в формах на Onepage.

У меня есть опыт интеграции кастомного JavaScript в конструкторы сайтов (перехват submit, работа с динамическим DOM, MutationObserver, кроссбраузерность).

Предлагаю решение: Валидация через libphonenumber (для Германии), блокировка отправки при некорректном номере, уведомление на немецком и подсветка поля, нормализация номера в формате E.164 (+49…), фильтрация 0000000000;

Решение будет работать без SMS, стабильно на desktop и mobile, без конфликтов с другими скриптами.

Готов быстро реализовать и предоставить инструкцию по внедрению.

Показать оригинал

Перевести

Готов выполнить.
Опыт работы в Web Development более 12+.
Примеры работ https://koder.pp.ua/portfolio/

Показать оригинал

Перевести

Добрый день!
Меня зовут Дмитрий, компания King Kong Web.

Я ознакомился с вашим ТЗ по Onepage. Мы можем сделать клиентскую валидацию номера телефона без SMS, чтобы форма не отправлялась с "мусорными" номерами, а пользователь сразу видел ошибку.

Реализуем это через вставку кастомного JavaScript в Onepage: подцепимся к событию submit формы, проверим номер на 2 уровне (базовая проверка + правила для DE/+49), при ошибке заблокируем отправку и покажем сообщение на немецком. Также добавим подсветку поля, и при исправлении номера ошибка будет исчезать.

По подходу: оптимально использовать libphonenumber (через CDN), чтобы корректно валидировать немецкие номера и, при необходимости, нормализовать их в формат E.164 перед отправкой. Если Onepage не даст стабильно подключить библиотеку — сделаем надежный fallback на правила длины/паттернов (regex + логика против 0000/слишком коротко).

… После выполнения передадим готовый код для вставки, короткую инструкцию куда именно добавить в Onepage, какие селекторы используем и как проверить работу на desktop/mobile.

Готовы приступить сразу. Если нужно — пришлите ссылку на страницу с формой или скрин/HTML структуру, чтобы быстро подобрать самый стабильный способ подключения.

Показать оригинал

Перевести

Добрый день, Валерий.

Выбираю libphonenumber вместо regex. Это обеспечит точную проверку немецких номеров (+49), нормализацию до E.164 и блокировку фейков. Интегрирую через Custom Code, используя MutationObserver для стабильности с динамическим DOM.

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

Готов предоставить полный код и инструкции для интеграции в Onepage.

А еще, вместо базовой валидации, предлагаю расширить функционал до интеллектуальной маски ввода номера телефона (на основе intl-tel-input). Это значительно улучшит UX, автоматически форматируя номер во время ввода и подсвечивая правильный формат для Германии. Также можно добавить автоматическое определение страны по префиксу, что упростит ввод для пользователей из других стран в будущем.

Показать оригинал

Перевести

Привет,

Я могу реализовать валидацию номеров телефонов для ваших форм Onepage. У меня есть опыт работы с валидацией на стороне клиента с использованием JavaScript, работы с конструкторами форм и манипуляции с DOM в динамических средах.

Я создам скрипт валидации, который блокирует отправку недействительных немецких номеров телефонов, таких как 0000000000, короткие номера и повторяющиеся шаблоны, валидирует как форматы +49, так и местные 0, используя библиотеку Google libphonenumber для точной валидации немецких номеров, показывает сообщения об ошибках на немецком языке с красной рамкой, нормализует действительные номера в формат E.164 перед отправкой и работает надежно на настольных и мобильных браузерах.

Что касается опыта работы с Onepage.io, я не работал напрямую с Onepage.io, но у меня есть опыт интеграции пользовательского JavaScript в платформы, такие как Webflow и Wix, где существуют аналогичные проблемы с динамическими идентификаторами и асинхронной загрузкой форм. Подход аналогичен, используя стабильные селекторы, MutationObserver для асинхронной загрузки и делегирование событий.

Что касается подхода, я рекомендую использовать libphonenumber через легковесную версию CDN, такую как google libphonenumber js. Это более надежно, чем регулярные выражения для немецких номеров, которые имеют переменную длину. Регулярные выражения могут работать как запасной вариант, но не поймают все крайние случаи.
…
Для нормализации в формате E.164 libphonenumber может нормализовать действительные номера в формат E.164 перед отправкой формы, что помогает с согласованностью данных CRM.

Для стабильности DOM я буду использовать несколько запасных селекторов, таких как тип ввода tel, текст заполнителя и текст метки, и реализую MutationObserver для повторного подключения валидации, если форма загружается асинхронно. Я также протестирую несколько форм на странице и нацелюсь на правильную.

Я предоставлю готовый к использованию код JavaScript с ссылками на библиотеку CDN, инструкциями по интеграции, документацией по селекторам и необязательным CSS для стилизации ошибок.

Сроки: 1 неделя
Стоимость: от 400 до 500 долларов США

Я готов начать работу немедленно.

Юссеф

Показать оригинал

Перевести

Здравствуйте, напишите в лс
--------------------------------------------------

Здравствуйте. Работаю с JavaScript более 8 лет. Готов настроить валидацию ввода. Обращайтесь.

Показать оригинал

Перевести

Здравствуйте! Я внимательно изучил ваш проект и готов приступить к его реализации. Давайте обсудим детали для наилучшего выполнения.

Доброго дня. Подобные задачи делал, но не на onepage
Функция вставки своего кода доступна в платных версиях - потому что-то проверить не могу.
Получится или нет, не скажу. Но опыт в целом есть и лично мне нужно разбираться "на месте". Подходит - обращайтесь.
Делал: Скрипт унификации мобильных номеров - есть в портфолио.

Здравствуйте, Валерий Щербаков.
Я более внимательно проверил ваши требования.
Я могу полностью создать раздел, используя библиотеку (libphonenumber или другую) и несколько пользовательских функций.
В этом случае мне не нужно изменять DOM для этого.
Я добавлю только новый раздел (для ошибки).
Надеюсь заключить с вами контракт.
Спасибо.

Показать оригинал

Перевести

Добрый вечер. Ваше задание мне вполне понятно. Я знаю, как решить вашу проблему, напишу весь необходимый функционал с нужной валидацией. Номера будут корректные, всё как вы хотите...

Сделаю дополнительные проверки, вы будете очень довольны результатом!!!

Жду вас в личных сообщениях.

Показать оригинал

Перевести

Готова выполнить прямо сейчас, отдам код через час. Опыт более 4-х лет

ответы
1) Да. Подход, который я использую, является универсальным для любых no-code конструкторов
2) Однозначно libphonenumber-js как основной подход.
3) Да, это возможно
4) Каскад селекторов: скрипт ищет поле не по одному ID или классу, а по цепочке из 7 селекторов (тип tel, атрибуты name, placeholder). Даже если Onepage изменит один — сработает другой.

p/s напишите в лс, уже имею готовое решение

Показать оригинал

Перевести

Добрый вечер, выполню задание за 1 час, если интересно, пишите, буду рад сотрудничеству

upd: уже имею готовый код, только интегрироваться в вашу форму, нужно ссылка

Показать оригинал

Перевести

Здравствуйте.

Готов взяться. Пишите, обсудим.

1. У меня есть опыт с конструкторами.
2. Можно попробовать через regex.
3. Да.
4. Этот вопрос требует более детального ответа.

Показать оригинал

Перевести