Made on
Tilda
Урок 4 · Подготовка формы к передаче данных
04
Модуль 2 · Занятие 2
Форма собрана. Теперь делаем так, чтобы данные дошли до базы в том виде, в каком их туда ждут
Сверка
| Поле формы | Тип | Имя переменной | Обяз. | Колонка в базе | Тип в базе |
|---|---|---|---|---|---|
| Имя | Текст | name | да | name | text |
| Телефон | Телефон | phone | да | phone | text |
| нет | text | ||||
| Услуга | Список | service | да | service | text |
| Дата | Дата | date | да | preferred_date | date |
| Комментарий | Текст | comment | нет | comment | text |
| Источник | Скрытое | utm_source | — | source | text |
| Согласие | Чекбокс | consent | да | — | не хранится |
Это та самая таблица, которую мы заполнили в уроке 2. Сейчас мы просто проверяем, что форма ей соответствует: каждому полю есть куда приехать, и ничего лишнего форма не собирает.
Обязательность
Без этого поля заявку нельзя обработать. Нет телефона — некуда позвонить. Нет услуги — непонятно, что записывать. Нет даты — нечего ставить в расписание.
Поле полезно, но без него заявка остаётся заявкой. Email, комментарий, «откуда узнали». Это данные «приятно иметь», а не условие работы.
Валидация
Тексты
| Ситуация | Что делаем | Плохой текст | Хороший текст |
|---|---|---|---|
| Пустое имя | Показываем ошибку | Ошибка | Как к вам обращаться? |
| Email без @ | Показываем ошибку | Invalid email | Проверьте адрес: похоже, пропущена «собака» |
| Телефон короче маски | Показываем ошибку | Неверный формат | Нужно 10 цифр после +7 |
| Нет согласия | Показываем ошибку | Поставьте галочку | Без согласия мы не можем сохранить заявку |
| Лишние пробелы по краям | Чиним молча | — | — |
| Имя с маленькой буквы | Чиним молча | — | — |
| Телефон с 8 вместо +7 | Чиним молча | — | — |
Правило простое: если мы понимаем, что человек имел в виду, — исправляем сами и не отвлекаем его. Если не понимаем — спрашиваем, называя, что именно поправить.
Скрытое поле
Источник перехода (utm_source), название страницы, идентификатор кампании, пометку «заявка с лендинга». Всё, что известно системе, но не человеку.
Добавляется в интерфейсе: блок формы → Контент → Добавить поле → «Скрытое поле». Руками в HTML ничего вписывать не нужно.
API-ключи, токены, пароли, идентификаторы доступа к базе. Любой человек откроет исходный код страницы и прочитает значение скрытого поля — оно скрыто от глаз, но не из HTML.
Источник заявки
| Способ | Как настраивается | Когда подходит |
|---|---|---|
| Скрытое поле с именем метки | Поле с именем utm_source — Tilda сама подставит значение из адреса страницы | Нужна одна-две метки, всё видно в списке полей формы |
| Опция «Посылать Cookie» | В настройках формы включается передача служебных данных целиком | Нужен весь набор меток и данные о переходе, без лишних полей в форме |
Проверяется одинаково: открываем опубликованную страницу с ?utm_source=test в адресе, отправляем заявку и смотрим, приехало ли значение в раздел «Заявки».
Публикация
01
Кнопка «Опубликовать» в редакторе. До этого страница живёт только в черновике и по ссылке не открывается.
02
Не в предпросмотре, а по настоящей ссылке — в отдельной вкладке и обязательно на телефоне.
03
Своими руками, с реальными данными. Смотрим, появилось ли сообщение об успехе.
04
Раздел «Заявки» в настройках сайта. Проверяем, что приехали все поля и имена совпадают с моделью.
Пока заявка не найдена в списке, страница не готова. «Форма вроде отправилась» — это не проверка.
Готовность
01
Страница опубликована и открывается по ссылке с телефона.
02
Имена переменных совпадают с моделью данных из урока 2 — буква в букву.
03
Обязательные поля отмечены, чекбокс согласия на месте.
04
Тестовая заявка отправлена и найдена в разделе «Заявки».
05
Скрытое поле с источником заполняется — проверено с ?utm_source=test.
На уроке 5 мы подключим к этой форме webhook. Если имена полей не сойдутся с моделью, разбираться придётся уже там — дольше и больнее.
Мини-артефакт урока 4
Вопросы для самопроверки
01
Почему проверка в браузере не заменяет проверку на сервере?
02
Что случится на уроке 5, если имя поля в форме не совпадёт с колонкой базы?
03
Где должен храниться ключ доступа к базе, если не в скрытом поле?