制作記事 Web制作アプリケーションWordPressContact Form 7 を Ajaxで生成したときに、Contact Form 7 のAjaxを有効にする

Contact Form 7 を Ajaxで生成したときに、Contact Form 7 のAjaxを有効にする

何言ってるんだ? というタイトルですが…。

一度表示したWebページで、Contact Form 7 を含むWebページをAjaxで取得して表示した際、そのContact Form 7 はAjaxが効かなくて困った。そんなときの対処方法。

Ajaxで取得した情報を表示した後に、下記を実行する。

if (wpcf7 && typeof wpcf7.init === 'function') { 
  document.querySelectorAll('.wpcf7 > form').forEach(function(form) {
    wpcf7.init(form);
  });
}

以上。