Как можно автоматически закрыть всплывающее (модальное) окно после того, как форма, созданная с помощью Contact Form 7 (cf7) в WordPress, будет успешно отправлена?

Каким образом можно закрыть модальное окно, реализованное с использованием jQuery Modal, после успешной отправки формы Contact Form 7, если стандартная ссылка для закрытия не работает и текущий код JavaScript, предполагающий закрытие окна через 5 секунд после отправки, не приводит к желаемому результату?
  • 5 декабря 2023 г. 20:39
Ответы на вопрос 2
Для автоматического закрытия всплывающего (модального) окна, в котором находится форма Contact Form 7, после успешной отправки формы, вы можете использовать JavaScript с использованием события `wpcf7mailsent` от Contact Form 7. Это событие срабатывает после того, как форма успешно отправлена.

В вашем случае с модальными окнами, использующими jQuery Modal, вы можете воспользоваться следующим кодом JavaScript:

```javascript
document.addEventListener('wpcf7mailsent', function(event) {
    // Закрыть модальное окно jQuery Modal после успешной отправки формы
    $('.modal').modal('hide'); // Закрываем модальное окно с классом 'modal'
    // Если у вашего модального окна есть другой класс или ID, измените селектор соответственно.
}, false);
```

Вы должны добавить этот скрипт на свою страницу с помощью хука `wp_footer` или воспользоваться каким-либо настраиваемым скриптовым полем, предоставляемым вашей темой или плагином. Пример добавления скрипта с помощью хука `wp_footer`:

```php
function enqueue_custom_script() {
    ?>
    <script>
    document.addEventListener('wpcf7mailsent', function(event) {
        $('.modal').modal('hide');
    }, false);
    </script>
    <?php
}
add_action('wp_footer', 'enqueue_custom_script');
```

Пример выше предполагает, что у вашего модального окна имеется класс `modal` и что `modal('hide')` является правильным вызовом для закрытия вашего модального окна с использованием jQuery Modal.

Важно проверить, что вы используете правильные идентификаторы и методы вашего конкретного jQuery модального плагина для закрытия окна, поскольку они могут варьироваться в зависимости от плагина. Например, некоторые реализации могут использовать `$.modal.close();` для закрытия модального окна.

Не забудьте убедиться, что ваш скрипт загружается после загрузки всех соответствующих библиотек jQuery и jQuery Modal, иначе ваши команды могут не выполниться корректно.
if ('ac0b387' == event.detail.contactFormId) {Попробуйте вместо хэша использовать ID формы. Его видно в адресной строке при редактировании формы.
Похожие вопросы