[SendIt] Несколько полезных нововведений в версии 1.1.2

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

1. Отправка по клику
Вы можете добавить любому html-элементу внутри тэга form атрибуты data-si-event=«click» и data-si-preset=«название пресета» после этого форма будет отправляться по клику на этот элемент. Этот функционал можно использовать, например, при подтверждении номера телефона, т.е. после ввода номера, пользователь нажимает кнопку, отправляется форма, вы отправляете ему код подтверждения и далее по схеме.

ВАЖНО! Отпраляя данные на события click, change, input, имейте ввиду, что для этих событий не действуют ограничения на количество отправок и работает только проверка токена. В связи с этим рекомендую НЕ отправлять почту на эти события.

2. Убрал стили по умолчанию
Они ломали вёрстку. Однако, если будете использовать многоэтапные формы, необходимо определить стили для класса v_hidden.

3. Поместил токен в сессию
По задумке это должно повысить эффективность защиты от спама. В частности, от прямых запросов через CURL.

4. Создал сниппет RenderForm
Мой инновационный подход с выносом параметров сниппета в файл не всем пришёлся по душе, поэтому для любителей вызвать сниппет добавил RenderForm. Пример вызова

{'RenderForm' | snippet: [
'tpl' => '@FILE chunks/forms/exampleForm.tpl',
'presetName' => 'snippet_form',
'extends' => 'default',
'redirectTo' => 0,
'redirectTimeout' => 3000,
'clearFieldsOnSuccess' => 1,
'fieldNames' => 'age==Возраст,name==Имя,phone==Телефон,email==Почта',
'successMessage' => 'Форма отправлена!',
'validationErrorMessage' => 'Исправьте ошибки!'
]}

Кроме первых двух, параметры такие же как в FormIt и AjaxForm. presetName — это ключ для записи параметров в сессию, поэтому, если на одной странице будет несколько вызовов сниппета с одинаковым ключом, параметры будут перезаписаны последним вызовом. Вы так же можете использовать наследование из файла с пресетами через параметр extends.

5. Атрибут data-si-nosave
В компоненте реализован механизм автоматического сохранения введённых пользователем данных, но иногда он мешает. Чтобы для конкретной формы отключить сохранение, добавьте ей атрибут data-si-nosave=«1»

Артур Шевченко

12 января 2024, 12:38

2 086

Поблагодарить автора Отправить деньги

Комментарии: 27

Купчинский Михаил

18 января 2024, 12:16

Добрый день!
При использовании компонента постоянно выскакивает ошибка
/var/www/u2436897/data/www/..............ru/core/cache/includes/elements/modx/revolution/modplugin/11.include.cache.php 14 PHP warning: Undefined array key «SendIt»

Артур Шевченко

18 января 2024, 13:40

Скинь строку на которой выскакивает это предупреждение.

Купчинский Михаил

18 января 2024, 13:43

14 строка

Артур Шевченко

18 января 2024, 13:45

Понятно. Скинь содержимое этой строки.

Купчинский Михаил

18 января 2024, 13:47

$cookies = $_COOKIE['SendIt']? json_decode($_COOKIE['SendIt'],1): [];

Артур Шевченко

18 января 2024, 13:51

Спасибо. Какая версия modx и php у тебя?

Купчинский Михаил

18 января 2024, 13:54

PHP Version 8.0.17 MODX 3.0.4

Наумов Алексей

18 января 2024, 15:20

В isset заверни хотя б)):

isset($_COOKIE['SendIt'])

Артур Шевченко

18 января 2024, 16:11

Я лучше сделал в !empty() завернул)))

Купчинский Михаил

19 января 2024, 14:26

Так что в итоге надо сделать?

Артур Шевченко

19 января 2024, 18:10

Можешь ничего не делать. можешь дождаться обновления. Можешь поменять $_COOKIE['SendIt'] на !empty($_COOKIE['SendIt'])

Купчинский Михаил

20 января 2024, 13:51

Вот такая конструкция
$cookies = !empty($_COOKIE['SendIt'])? json_decode(!empty($_COOKIE['SendIt']),1): [];
вырубает сайт напрочь Fatal error: Uncaught TypeError: array_merge():

А вот такая
$cookies = !empty($_COOKIE['SendIt'])? json_decode($_COOKIE['SendIt'],1): [];
Вызывает кучу ошибок при отправке формы с сайта
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 94
PHP warning: Undefined array key «extends»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 98
PHP warning: Undefined array key «sendGoal»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 99
PHP warning: Undefined array key «counterId»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 284
PHP warning: Undefined array key «comment»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 113
PHP warning: Undefined array key «fieldNames»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 117
PHP warning: Undefined array key «attachFilesToEmail»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 351
PHP warning: Trying to access array offset on value of type null
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 362
PHP warning: Undefined array key «snippet»
20.01.2024 13:49:40 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/pdotools/vendor/fenom/fenom/src/Fenom/Template.php(487): eval()'d code 7
PHP warning: Undefined array key «fieldsAliases»
20.01.2024 13:49:41 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 427
PHP warning: Undefined array key «placeholderPrefix»
20.01.2024 13:49:41 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 441
PHP warning: Undefined array key «fieldNames»
20.01.2024 13:49:41 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 456
PHP warning: Undefined array key «redirectTimeout»
20.01.2024 13:49:41 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 457
PHP warning: Undefined array key «redirectTo»
20.01.2024 13:49:41 ERROR /var/www/u2436897/data/www/maxhub.ru/core/components/sendit/model/sendit/sendit.class.php 458
PHP warning: Undefined array key «redirectTo»

Артур Шевченко

20 января 2024, 17:12

В телегу напиши мне

Диман

29 января 2024, 03:38

Подскажите пжл, как закрыть модальное окно на boostrap 5 после успешной отправки формы?

Артур Шевченко

30 января 2024, 11:48

На это событие и вызвать этот метод.

Диман

30 января 2024, 12:52

document.addEventListener('si:send:success', (e) => {
  const {target, result} = e.detail;
  // установим свой обработчик успешной отправки
  if(result.success){ 
   bootstrap.Modal.getOrCreateInstance(document.getElementById('id-формы')).hide();
  }
})

Вот так работает, только не знаю, на сколько это правильно

Александр

30 января 2024, 14:57

Более чем. Единственное, не обязательно

if(result.success)

использовать т.к. ты уже вызываешь событие

si:send:success

Вот так тоже будет работать

document.addEventListener('si:send:success', (e) => {
    bootstrap.Modal.getOrCreateInstance(document.getElementById('id-формы')).hide();
})

Диман

30 января 2024, 17:08

Благодарю, действительно работает!

Артур Шевченко

30 января 2024, 16:31

Я бы так сделал

document.addEventListener('si:send:success', (e) => {   
    bootstrap.Modal.getOrCreateInstance(e.detail.target).hide();
})

Диман

30 января 2024, 17:06

document.addEventListener('si:send:success', (e) => {   
    bootstrap.Modal.getOrCreateInstance(e.detail.target).hide();
})

этот вариант не заработал у меня

Евгений

15 марта 2026, 13:18

На всякий скопирую код для Bootstrap 4 (есть старый проект, лень переезжать на 5 версию):

/* Закрыть модальное окно после отправки */
document.addEventListener('si:send:success', (e) => {
    $('#id_формы').modal('hide');
})

Maks

31 января 2024, 16:20

А если на странице два окна как их после успешно отправки закрыть?

const exampleModal = new bootstrap.Modal(document.getElementById('exampleModalCall'));
  document.addEventListener('si:send:success', () => {
    exampleModal.hide();
  });

Сделал вот так одно окно закрывается после отправки.

Делаю еще для второго окна

const exampleModal = new bootstrap.Modal(document.getElementById('exampleModal'));
  document.addEventListener('si:send:success', () => {
    exampleModal.hide();
  });

Но так не срабатывает.

Сергей Карпович

01 февраля 2024, 09:06

Попробуй обратиться не к одному элементу getElementById, а ко всем: querySelectorAll

Андрей Шевяков

06 февраля 2024, 18:30

Добрый день!
Вопрос возник. В чанке письма siDefaultEmail, есть заголовок:

<h3>{$_pls['savedForm.form']}</h3>

Вопрос: откуда берутся данные в этот параметр {$_pls['savedForm.form']}?

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

Артур Шевченко

06 февраля 2024, 20:57

Если не указан параметр formName, то из атрибута data-si-form, если там пусто, то вполне вероятно, что в заголовке ничего не будет.

Андрей Шевяков

06 февраля 2024, 21:15

Не работает значит.

В пресете formName есть. В форме data-si-form есть. Чанк письма стандартный. Но ничего не передается в плейсхолдер {$_pls['savedForm.form']}

Версия SendIt — 1.1.2-pl

Артур Шевченко

06 февраля 2024, 22:00

На досуге посмотрю в чём дело.

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

[SendIt] Несколько полезных нововведений в версии 1.1.2

Комментарии: 27

Здесь упомянуты