Кнопка «Добавить участника» в форме Tilda: повторяемые поля

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

Мод «Повторяемая группа полей» повторяет подготовленный набор и собирает записи в итоговое поле формы. Разберём пример с участниками: имя и роль каждого, плюс общие контакты того, кто отправляет заявку.

Сначала определите короткий набор для одного участника. Например, имя и роль: взрослый или ребёнок. Контакт организатора оставьте обычным общим полем, чтобы не заставлять повторять один телефон для каждой записи.

Добавьте исходные поля рядом друг с другом в форме Tilda и сохраните их имена переменных. Для этого мода не включайте в повторяемую группу файлы, телефоны, даты с виджетами и вычисляемые поля. Начните с простых поддерживаемых полей и небольшой группы.

В той же форме создайте скрытое поле с переменной participants_summary. Через него собранные записи передаются вместе с заявкой. Без проверки этого поля можно увидеть красивую форму на сайте, но не получить ожидаемый список у получателя.

Подключите нужный сервис приёма заявок средствами Tilda. Не храните итог только в видимой подписи на странице: такая подпись не заменяет отправляемое поле. Важен тот результат, который окажется в полученной заявке.

В конструкторе укажите ID блока или общий CSS-класс нужных форм. Для общего класса можно использовать uc-form-repeat. Перечислите переменные полей группы через запятую и задайте минимальное и максимальное число записей.

Выбирайте ограничение по задаче. Для семейного занятия может быть достаточно нескольких участников, для групповой заявки — больше. Не ставьте большой предел без причины: длинную форму сложнее заполнить и проверить. Подпись действия лучше делать конкретной: «Добавить участника» понятнее, чем «Ещё».

1. Подготовьте исходные соседние поля и скопируйте их переменные.
2. Добавьте скрытое поле participants_summary в эту же форму.
3. Выберите область, набор полей и границы количества в конструкторе.
4. Поставьте полученный код в T123 после формы и опубликуйте страницу.
5. Создайте две записи с разными именами, затем добавьте ещё одну и проверьте управление.

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

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

Проверьте итоговое скрытое поле, названия и порядок данных. Если список пришёл не так, как ожидали, сначала сравните имена переменных и participants_summary. Красивое добавление полей на экране само по себе ещё не подтверждает передачу списка.

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

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

Читайте также: Загрузка файлов в форме Tilda: выбор и перетаскивание · Как сохранить заполненную форму в Tilda после обновления.