Хватить это терпеть! Или зачем столько чанков в FormIt!?
Привет сообществу!
Небольшая хитрость которая поможет новичкам избавиться от множества чанков/файлов писем с сайта и реализовать их в одном чанке/файле. Кроме этого пару слов о том, что происходит с MODX в конце заметки.
Предисловие:
Пару месяцев назад в чате был небольшой джентльменский спор между Павлом Зарубином и Евгением на тему «Так ли хорош FormIt?». В этом споре, я разместился где-то посередине так как я вижу и плюсы и минусы данного компонента. Эта заметка об одном из минусов, ну и конечно же решение.
Итак, проблема
А если быть точнее, столько же, сколько и различных форм на сайте. Когда ко мне попадают чужие проекты, я вижу там 100500 чанков которые отличаются только тем, что у них разное количество полей или просто разные поля.
Они выглядят примерно так:
Хоть я и в бэкенде недавно, но меня это удручает, поскольку сегодня существует понятие «Наследование» и например в miniShop2 те же самые письма реализованы прекрасно с помощью fenom.
Предлагаю самое простое решение, воспользоваться хуком и немного схитрить используя свойство fieldNames сниппета FormIt который служит тому чтобы при записи данных форм в БД с помощью родного хука FormItSaveForm переименовывать названия полей, ведь по умолчанию будут использованы ключи глобального массива с формой. Синтаксис такой: Название поля==Новое название и это всё через запятую. Название поля — это атрибут name у полей (Вдруг кто не знал).
«Что этот сниппет себе позволяет?!» или что сниппет/хук делает объясню вкратце:
Забирает значение свойства fieldNames и указанных данных пользователя заполнившего форму и с помощьюмагии методов создает новое поле fields, т.е. в чанке письма будет доступен плейсхолдер
[[+fields]] в котором будет JSON массив с названием и значением от пользователя.
Теперь в вызове сниппета FormIt указывайте в свойство fieldNames список нужных полей и пользуйтесь одним чанком.
Недавно Иван Бочкарёв писал о том, что происходит с MODX на Github и мне также хочется призвать разработчиков к активности. Я считаю, что MODX переживает не лучшие времена и понятно, что его развитие в основном зависит от более опытных разработчиков и от MODX LLC, но мы ведь тоже можем хоть немного повлиять на развитие нашей платформы. Я также в свою очередь делаю вклад насколько мне позволяют знания, опыт, время и возможности. Вступайте в группу MODX Contributors
Вам спасибо за внимание, а мне потому что…
☕ Угостить чашкой кофе
UPD
Обновлен сниппет для значений radio
UPD: 14.11.2019
Обновлен сниппет/хук, добавлен trim
Небольшая хитрость которая поможет новичкам избавиться от множества чанков/файлов писем с сайта и реализовать их в одном чанке/файле. Кроме этого пару слов о том, что происходит с MODX в конце заметки.
Предисловие:
Пару месяцев назад в чате был небольшой джентльменский спор между Павлом Зарубином и Евгением на тему «Так ли хорош FormIt?». В этом споре, я разместился где-то посередине так как я вижу и плюсы и минусы данного компонента. Эта заметка об одном из минусов, ну и конечно же решение.
Итак, проблема
Много чанков
А если быть точнее, столько же, сколько и различных форм на сайте. Когда ко мне попадают чужие проекты, я вижу там 100500 чанков которые отличаются только тем, что у них разное количество полей или просто разные поля.
Они выглядят примерно так:
...
<li>Имя: [[+name]]</li>
<li>Телефон: [[+phone]]</li>
......
<li>Имя: [[+name]]</li>
<li>Email: [[+email]]</li>
......
<li>Имя: [[+name]]</li>
<li>Email: [[+email]]</li>
<li>Тема обращения: [[+subject]]</li>
<li>Сообщение: [[+message]]</li>
...и так далее.Хоть я и в бэкенде недавно, но меня это удручает, поскольку сегодня существует понятие «Наследование» и например в miniShop2 те же самые письма реализованы прекрасно с помощью fenom.
Решение
Предлагаю самое простое решение, воспользоваться хуком и немного схитрить используя свойство fieldNames сниппета FormIt который служит тому чтобы при записи данных форм в БД с помощью родного хука FormItSaveForm переименовывать названия полей, ведь по умолчанию будут использованы ключи глобального массива с формой. Синтаксис такой: Название поля==Новое название и это всё через запятую. Название поля — это атрибут name у полей (Вдруг кто не знал).
1. Вызов FormIt
// Синтаксис MODX
[[FormIt?
...
&hooks=`fields,email` // сниппет fields мы с вами создадим в следующем шаге
&fieldNames=`name==Имя,phone==Контактный телефон`
&emailTpl=`email.tpl`
]]
// Синтаксис fenom
{'FormIt' | snippet : [
...
'hooks' => 'fields,email', // сниппет fields мы с вами создадим в следующем шаге
'fieldNames' => 'name==Имя,phone==Контактный телефон',
'emailTpl' => '@FILE chunks/email/email.tpl'
]}2. Создание сниппета/хука
Создадим сниппет и укажем fields в качестве названия с таким кодом:<?php
$fields = explode(',', $hook->formit->config['fieldNames']);
foreach ($fields as $key => $field) {
$f = explode('==', trim($field));
$value = $hook->getValue($f[0]);
if (is_array($value)) {
$value = implode(', ', $value);
}
$result[] = array(
'name' => $f[1],
'value' => $value,
);
}
$hook->setValue('fields', $modx->toJSON($result));
return true;«Что этот сниппет себе позволяет?!» или что сниппет/хук делает объясню вкратце:
Забирает значение свойства fieldNames и указанных данных пользователя заполнившего форму и с помощью
[[+fields]] в котором будет JSON массив с названием и значением от пользователя.
3. Чанк/файл email.tpl
Я лично из лагеря fenom, но стараюсь и ради тех кто всё еще пользуется родным синтаксисомЕсли вы не пользуйтесь fenom, то весьма кстати вам пригодиться сниппет getImageList который идёт вместе с MIGX.
Кстати, у меня есть пара заметок о MIGX где я подробно рассказывал о нём. Вот первая заметка, а вот вторая, почитайте, уверен, будет интересно, если еще не читали.
// Синтаксис MODX
<h3>Обратная связь:</h3>
[[getImageList?
&value=`[[+fields]]`
&tpl=`@CODE:<li>[[+name]]: [[+value]]</li>`
]]
// Синтаксис fenom
<h3>Обратная связь:</h3>
{foreach $fields | fromJSON as $field}
<li>{$field['name']}: {$field['value']}</li>
{/foreach}Итог
Теперь в вызове сниппета FormIt указывайте в свойство fieldNames список нужных полей и пользуйтесь одним чанком.
__________________________________
Пару слов о самом MODX
К данной заметке это не относится, но хочется выразится о MODX и о MODX3Недавно Иван Бочкарёв писал о том, что происходит с MODX на Github и мне также хочется призвать разработчиков к активности. Я считаю, что MODX переживает не лучшие времена и понятно, что его развитие в основном зависит от более опытных разработчиков и от MODX LLC, но мы ведь тоже можем хоть немного повлиять на развитие нашей платформы. Я также в свою очередь делаю вклад насколько мне позволяют знания, опыт, время и возможности. Вступайте в группу MODX Contributors
Вам спасибо за внимание, а мне потому что…
☕ Угостить чашкой кофе
UPD
Обновлен сниппет для значений radio
UPD: 14.11.2019
Обновлен сниппет/хук, добавлен trim
Комментарии: 21
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
Я поменял тип группы: t.me/modx_contributors
Поменял в заметке
или я где-то пропустил подключение pdoTools?
я использовую formit через ajaxform, и у меня не получалось в чанках письма юзать fenom — только родной синтаксис и тот без модификаторов. то есть если значение [[+phone]] пустое, то в письме так и будет — "[[+phone]]"
Добавляю все поля которые мне нужны из разных форм. Клиенту приходят только те поля, что заполнены.
Создаём чанк ajaxForms:
Это единый чанк, в котором вызывается сниппет ajaxForm с необходимыми параметрами.
В моём случае каждая отдельная форма — это отдельный чанк. Если эти чанки мало чем различаются, то можно использовать extends из fenom, переписывая лишь изменяющиеся значения, а остальное не трогать.
И далее в шаблоне страницы вызов нужной формы:
В нём мы подменили значения, передающиеся в чанк ajaxForm.
Пример чанка callback с формой:
Если нужно вызвать похожую форму но с другим заголовком и другими параметрами, то создадим чанк question, который наследует чанк callback:
И вызов этой формы в шаблоне страницы:
Таким образом, для всех форм мы можем задать единые параметры вызова сниппета ajaxForm, и при необходимости перезаписать их. А также под каждую форму либо создать отдельные чанки, либо унаследовать от одного чанка кучу других с индивидуальными параметрами.
Дополнительно я скрываю уведомления jgrowl js-скриптом:
Все уведомления об ошибках показываются под полями форм, в коде span c классом error. А если форма успешно отправлена, то с помощью скрипта выше мы скрываем popup-форму, если она была открыта, и показываем другое popup-окно:
Оно же всплывает и при отправке обычных не popup-форм. Да, насчёт popup-окон, актуально при использовании flexbox3.
Так ведь намного лучше
Я делаю примерно так:
И в чанке формы:
нужно так: если поле name_1 имеет значени true, то поле name_2 становится обязательным.
родной параметр validate вроде как по одному полю работает, а хуки не выводят сообщение об ошибке.