Контакты | E-mail: info@modx-evo.ru | Заказать обратный звонок



Урок 13 – Форма обратной связи

В рамках данного урока мы познакомимся с еще одним сниппетом MODx – eForm, который служит для создания различных форм. Мы же создадим для нашего сайта форму обратной связи.

Наша форма будет иметь следующие поля:

Сниппет eForm устанавливается по умолчанию вместе с CMS MODx, в этом вы можете убедиться, если перейдете на страницу управления сниппетами «Элементы»-«Управление элементами»-«Сниппеты»:

modx evo eform

Создаем форму обратной связи MODx eForm

Откройте ресурс «Контакты» на редактирование, назначьте наш последний созданный шаблон, если он еще не назначен и отключите использование визуального редактора для этого ресурса. Сохраните ресурс и откройте на редактирование заново, после чего добавьте в содержимое ресурса следующую строку:

[ !eForm? &formid=`contact-form` &tpl=`form-tpl`&to=`mail@mail.ru` &mailselector=`otdel` &report=`report-tpl` &thankyou=`thank-tpl` &vericode=`1` &subject=`Сообщение с моего сайта`]]

Как вы догадались, это вызов сниппета eForm с параметрами:

&formid=`contact-form` - это уникальный идентификатор формы, который должен обязательно быть указан в атрибуте id вашей формы или в значение скрытого поля с идентификатором formid;

&tpl=`form-tpl` - задает имя чанка с вашей формой обратной связи;

&to=`` -задает список электронных адресов через запятую, на которые должны приходить сообщения с формы обратной связи;

&mailselector=`otdel` - позволяет выбрать из получателей в зависимости от типа сообщения;

&report=`report-tpl` - параметр передает имя чанка, который используется в качестве шаблона письма, которое приходит получателю;

&thankyou=`thank-tpl` - параметр передает имя чанка, который используется в качестве шаблона письма, приходящее отправителю;

&vericode=`1` - задает выводить или не выводить проверочный код для формы;

&subject=`` - тема сообщения с формы обратной связи.

Как вы уже догадались, нам необходимо дополнительно создать несколько чанков: form-tpl, report-tpl, thank-tpl. Этим мы и займемся.

Чанк form-tpl – шаблон формы обратной связи

Создаем новый чанк с именем form-tpl и вписываем в его содержимое следующее:

modx eform

Сохраняем чанк.

Теперь давайте обратим внимание на некоторые конструкции.

[ +validationmessage+] – это плейсхолдер для вывода сообщений об ошибках, которые могут быть допущены при заполнении формы.

Как вы заметили, имеется скрытое поле с именем formid и значением contact-form, о котором мы говорили чуть выше.

eform=”Текст сообщения:html:1” Данная конструкция задает несколько параметров для поля формы:

eform="[описание]:[тип данных]:[обязательное ли поле]:[сообщение об ошибке]:[правило проверки]"

«Описание» – это текстовое описание поля;

«Тип данных» – может принимать следующие значения: string – любой текста, date – дата, integer – целое число, email – электронный адрес, float – число, html – текст в формате HTML, file – поле для отправки файла.

«Обязательное ли поле» - принимает два возможных значения: 0-необязательное, 1 – обязательное.

«Сообщение об ошибке» - текст сообщения об ошибке, в нашем случае текст отсутствует.

«Правило проверки» - в нашем случае правило не задано.

[ +verimageurl+] – плейсхолдер для вывода капчи.

Чанк report-tpl – шаблон уведомления с формы обратной связи

Создадим еще один чанк с именем report-tpl и впишем в код следующее содержимое:

сниппет eform

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

Чанк thank-tpl – шаблон уведомления с формы обратной связи для отправителя

Создаем еще один чанк с именем thank-tpl и впишем в код следующее содержимое:

eform modx

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

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


Просмотров: 7368


Статьи по теме:


Написать комментарий

Поля помеченные * обязательны для заполнения.


Гость
Постов: 1
Comment
Re: статья
Добавлен #1 на : Сб. Март 07, 2015, 15:54:04
Чанк report-tpl – шаблон формы обратной связи поменяй на
Чанк form-tpl – шаблон формы обратной связи
admin
Постов: 1
Comment
report-tpl
Добавлен #2 на : Вт. Март 10, 2015, 08:26:22
Спасибо! Не заметил!

Будь в курсе!

Введите Ваш Email и имя.

Digital Newsletter

Чтобы отписаться нажмите сюда ».