Как запретить повторную отправку в Contact Form 7

Я часто использую в своей работе отличный плагин для создания форм Contact Form 7. Изначально этот плагин предназначался для создания контактных форм, но путём некоторых махинаций с хуками (actions в WordPress) он превращается в гибкий инструмент для разработки форм любого назначения. Сегодня речь пойдёт о простом решении одной проблемы плагина — повторной отправки формы.

Если ваш сайт работает не супер-быстро, и если, вдобавок, пользователь нетерпелив, то он склонен нажимать кнопку «Отправить» несколько раз, даже несмотря на то, что рядом с кнопкой крутится иконка ожидания. В итоге мы получаем несколько запросов с теми же самыми данными и должны как-то эту ситуацию отлавливать.

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

Я же предлагаю простое и логичное решение, которое решает проблему на 98%, а может и на 100%.

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

Ниже приведён сразу готовый код, который вы можете вставить в ваш javascript.

jQuery(document).on('click', '.wpcf7-submit', function(e){
    if (jQuery('img', jQuery(this).closest('div')).css('visibility') === 'visible') {
        e.preventDefault(); 
        return false;
    }
});

Этот код выглядит немного иначе для Contact Form 7 версии 4.6 и выше:

jQuery(document).on('click', '.wpcf7-submit', function(e){
     if( jQuery('.ajax-loader').hasClass('is-active') ) {
          e.preventDefault();
          return false;
     }
});

Подписывайтесь на новости, впереди вас ждёт много интересного!