MODX FormIt пример формы обратной связи. Modx revo formit примеры
MODX FormIt пример формы обратной связи
Основным дополнением в MODX для создания форм является FormIt. Перед использование примеров кода проверьте, установлен ли FormIt. Если данный компонент еще не установлен, то сделать это можно через установщик приложений.
Форма будет состоять из 3 частей:
- Сниппет с заготовкой шаблона формы
- Сниппет с html шаблоном письма на почту
- Код вызова сниппета FormIt, который будет обрабатывать форму
Чанк шаблона формы: [[$feedback-tpl]]
<form> <label>Имя: <input type="text" placeholder="Ваше имя"></label><br> <label>Почта: <input type="email" placeholder="Адрес электронной почты"></label><br> <textarea placeholder="Текст сообщения"></textarea><br> <input type="submit" value="Отправить"><br> </form>
<form> <label>Имя: <input type="text" placeholder="Ваше имя"></label><br> <label>Почта: <input type="email" placeholder="Адрес электронной почты"></label><br> <textarea placeholder="Текст сообщения"></textarea><br> <input type="submit" value="Отправить"><br> </form> |
Включает в себя три поля (имя, емейл и текстовое поле) и одну кнопку.
HTML шаблон письма, в чанке [[$feedback-email-tpl]]
Имя: [[+feedback_name]]<br /> Почта: [[+feedback_email]]<br /> Сообщение: [[+feedback_message]]
Имя: [[+feedback_name]]<br /> Почта: [[+feedback_email]]<br /> Сообщение: [[+feedback_message]] |
doc.modx.expert
[Revo] Создание формы обратной связи на CMF MODX FormIt от Василисы Белозеровой
Итак, создадим форму он-лайн заявки на кредит, простенькую.
Скачиваем и устанавливаем пакет FormIt (не забываем его установить!)
Вставляем в шаблон отображения станицы
[[$forma]]
Создаем чанк с именем forma и вписываем в него этот код
<div><h5>Кредит онлайн</h5> [[!FormIt? &hooks=`email,redirect` &emailTpl=`responseTpl` &emailSubject=`Заявка на кредит` &emailTo=`[email protected]` &redirectTo=`35`]]<form method="post" action="[[~[[*id]]]]"><label for="contact_otdel">Кредитный продукт</label><br/> <select name="contact_otdel" value="[[!+fi.contact_otdel]]"><option value="Экспресс-Кредит">Экспресс-кредит</option><option value="Кредит наличными">Кредит наличными</option><option value="Ипотека">Ипотека</option><option value="Автозалог">Автозалог</option><option value="Автокредит">Автокредит</option><option value="Кредит под залог">Кредит под залог</option></select></div><div><label for="contact_name">Ваше имя *</label></div><div><input type="text" name="contact_name" size="20" maxlength="60" value="[[!+fi.contact_name]]" /></div> <div><label for="contact_tel">Телефон *</label></div><div><input id="contact_tel" type="text" name="contact_tel" size="20" maxlength="60" value="[[!+fi.contact_tel]]" /></div><br/> <div><input name="submit" type="submit" value="Подать заявку"></div></form>
Создаем чанк responseTpl с таким кодом
<p>Имя отправителя: [[+contact_name]] <br />Тел.: [[+contact_tel]]<br />Текст сообщения: [[+contact_otdel]]<br /></p>
Создаем страницу с id 35 (если другое, исправляем в файле form), называем ее Благодарим! и вписываем текст Ваша заявка отправлена.
Прикрепить файл в форму связи Mod Revo FormIt
Для этого в саму форму (forma чанк) надо добавить:
<label for="contact_attachment">Прикрепить файл: </label> <input type="file" name="contact_attachment" value="[[!+fi.contact_attachment]]" />И заменить строку открытия формы на
<form method="post" action="[[~[[*id]]]]" enctype="multipart/form-data">
А в responseTpl добавить:
[[+contact_attachment]]
Вот и все) Если это кому-то поможет, буду очень рада
yotadom.com
создание формы в Revo / Сниппеты / Modx Revolution / Технический блог веб-разработчика
FormIt - создание формы в Revo
Этот сниппет предназначен для отправки форм.
Параметры сниппета: &hooks=`email` - хук это скрипт, который как раз и будет отправлять данные нашей формы на почту. emailTo=`[email protected]` - почта, на которую будут отправлены данные формы. emailSubject=`Тема письма` - заголовок темы письма. successMessage=`Спасибо! Мы с вами обязательно свяжемся` - сообщение с текстом благодарности. &emailTpl=`OnMail` - шаблон письма с заполненной формой, который придёт администратору на почту. redirectTo =`7`- id страницы, на которую будет перенаправлен пользователь, в случае успешной отправки формы. Это может быть сообщение с текстом благодарности например. &validate=`name:required,email:required,message:required` - обязательные для заполнения поля. Без них пользователь не сможет отправить форму. &emailFromName=`Почтовый робот` - заголовок имени отправителя, который будет приходить к нам при отправке письма. &emailFrom=`[email protected]` - заголовок email отправителя. &submitVar=`submit` - значение атрибута name для input type="submit". Используется в тех случаях, если на странице используются несколько форм.
Разумеется, сам по себе сниппет FormIt, без самой формы, никуда ничего отсылать не будет. Нужно вывести саму форму. Вот простейший пример с двумя полями:
<form method="post" action=""><div><label for="name">Имя пользователя: </label><br /><input name="name" value="" /></div><div><label for="email">E-Mail </label><br /><input name="email" value="" /></div><div><label for="message">Текст сообщения </label><br /><textarea name="message" cols="30" rows="3"></textarea></div><div><input name="submit" type="submit" value="Отправить"/></div></form>
Однако, этого всё ещё недостаточно. Нам нужно создать чанк шаблона письма, которое к нам придёт на почту, а в нём прописать например такой текст:
Вам пришло письмо от пользователя с именем [[+name]] А вот и его данные: Email: [[+email]]Текст сообщения: [[+message]]
Всё! Теперь наша форма может отправлять введённые данные на указанную вами почту.
cms-dev.ru
