【WordPress】contact-form7-confirm.jsでカレンダー日付も取得する

WordPress（ワードプレス）のお問い合わせプラグイン「Contact Form 7」に確認画面を追加する「contact-form7-confirm.js」でカレンダーの値も取得する方法です。

「Contact Form 7」とは？

「Contact Form 7」は、WordPressで最も有名なお問い合わせフォームのプラグインです。

日本人が作っているプラグインなので、色々と親切でわかりやすいです。

参考：Contact Form 7

「Contact Form 7」で確認画面を追加する方法

お問い合わせプラグイン「Contact Form 7」に確認画面を追加する方法にはいろいろありますが、こちらのページで紹介されている「contact-form7-confirm.js」を使う方法が理想的でした↓↓↓

参考：ContactForm 7 確認画面 をカスタマイズして、入力した値のみを表示

しかし、これだとカレンダーの数値が反映されないという問題があったので修正を加えました。

contact-form7-confirm.jsの修正

当方、PHP等がよくわからないので勘での作業になります。

おそらく間違えてる点もあると思うので参考程度にお願いします。

68行目の以下のコードを見つけます↓↓↓

} else if (child.get(0).tagName.toLowerCase() == ‘textarea’){

その上にこちらのコードを挿入します↓↓↓

} else if (child.hasClass(‘wpcf7-date’)){
jQuery(this)
.after(
jQuery(‘<span>’).addClass(‘wpcf7-form-control-wrap-confirm’)
);
child
.change(function(){
jQuery(this).parent().next().text(
jQuery(this).val()
);
})
.change()
;

次に214行あたりの以下のコードを探して↓↓↓

} else if (child.get(0).tagName.toLowerCase() == ‘textarea’){

その上に以下のコードを入れる↓↓↓

} else if (child.hasClass(‘wpcf7-date’)){
if (child.hasClass(‘wpcf7-validates-as-required’) && child.val().length == 0){
error.append(jQuery(‘<li>’).text(option.validates.required.before + title.replace(‘必須’, ”) + option.validates.required.after));
jQuery(this).addClass(‘error’);

つまり、カレンダーの数値を引き継ぐコードが入ってなかったんですね。

これで合っているかわかりませんが、とりあえず取得は出来ました。

参考にどうぞ。

Byさちお

＼ SHARE ／