wpcf7_feedback_responseでエラー表示位置の指定方法
-
作者様、有用なプラグインを公開いただきありがとうございます。
また、フォーラム参加者の方々、いつも有用な情報をありがとうございます。
今回、お尋ねしたいのはContact Form 7 バージョン 5.7.2において、wpcf7_feedback_responseを用いてエラーメッセージを目的の位置に表示する方法です。やりたい事は以下の画像のように生年月日のどれかに未入力があった場合、一度だけ指定した場所にエラーメッセージを表示するというものです。
該当箇所のコンタクトフォームのコード
<tr> <th class="hissu">生年月日</th> <td>[select* birth-year class:text-short4 first_as_label "---" "1950" "1951" "1952" "1953" "1954" "1955" "1956" "1957" "1958" "1959" "1960" "1961" "1962" "1963" "1964" "1965" "1966" "1967" "1968" "1969" "1970" "1971" "1972" "1973" "1974" "1975" "1976" "1977" "1978" "1979" "1980" "1981" "1982" "1983" "1984" "1985" "1986" "1987" "1988" "1989" "1990" "1991" "1992" "1993" "1994" "1995" "1996" "1997" "1998" "1999" "2000" "2001" "2002" "2003" "2004" "2005"]年[select* birth-month first_as_label "---" "1" "2" "3" "4" "5" "6" "7" "8" "9" "10" "11" "12"]月[select* birth-date first_as_label "---" "1" "2" "3" "4" "5" "6" "7" "8" "9" "10" "11" "12" "13" "14" "15" "16" "17" "18" "19" "20" "21" "22" "23" "24" "25" "26" "27" "28" "29" "30" "31"]日 <span class="wpcf7-custom-item-error birth-year birth-month birth-date"><span class="wpcf7-form-control"></span></span></td> </tr>
こちらは、Contact Form 7 バージョン 5.5.6.1で作成して期待通りに動作している公開サーバーの状態です。
wpcf7_feedback_responseのコードは以下のようになっています。
// Auther Takata // エラーの出力位置をカスタマイズする /* 参考リンク: https://do-jo.jp/plugins/1307/ * https://qiita.com/kinshist/items/7a16a1fe4bae27fe11b2 * https://nldot.info/i-want-to-change-the-validation-message-display-position-in-copipable-contact-form-7/ */ function wpcf7_custom_item_error_position( $items, $result ) { $class = 'wpcf7-custom-item-error'; $names = array( 'birth-year', 'birth-month', 'birth-date', 'qualifications', 'other-qualifications' ); // name属性を指定 $processed_day_messeage = false; if ( isset( $items['invalid_fields'] ) ) { foreach ( $items['invalid_fields'] as $k => $v ) { $orig = $v['into']; $name = substr($orig, 0, strcspn($orig,':')); $name = substr( $name, strrpos($name, ".") + 1 ); if ( in_array( $name, $names ) ) { if ($name == 'birth-year' || $name == 'birth-month' || $name == 'birth-date') { if ($processed_day_messeage == true) { unset($items['invalid_fields'][$k]); continue; } else { $processed_day_messeage = true; } } $items['invalid_fields'][$k]['into'] = ".{$class}.{$name}"; } } $items['invalid_fields'] = array_values($items['invalid_fields']); } return $items; } add_filter( 'wpcf7_feedback_response', 'wpcf7_custom_item_error_position', 10, 2 );
年・月・日の3つの内いずれかが未入力であった場合、他にも未入力があると、複数個エラーメッセージが出るので1つのみ残して
$items[‘invalid_fields’]のエラーを削除してエラーを1つだけにして、$items[‘invalid_fields’]のintoにエラーを出したい場所のクラスを指定して
実現しています。しかしながら、テスト環境でプラグインを最新化しContact Form 7 バージョン 5.7.2においては同様のコードを用いても
うまくエラーが指定した場所に表示されず、エラーの発生した要素の直下に表示されてしまいます。テスト環境でしたので、コードに
error_log( 'カスタムログ出力:$items["invalid_fields"] ' . print_r($items['invalid_fields'], true) );
を入れ込んで
デバッグログに、$items[‘invalid_fields’]をダンプしてみた所、バージョン 5.5.6.1から項目名の変更があったため
バージョン 5.7.2では拾えてなかったようでしたので、項目名をfield
に変更して、複数エラーを1つにする事は出来ました。しかし、バージョン 5.5.6.1にあったintoという項目が外側に移動していました。
(Multi-Step Forms等に対応するためか外側のintoでエラーの発生したフォーム名が格納されていました。)
ですので、書き換えるのはここじゃないと判断しダンプ結果を再確認した所、idref
という項目が新たに用意されていました。
試しにこちらにエラーを出したい要素のクラス名を指定してみましたがダメでした。上手くいかないのは当方のミスなのは明白なのでスクリプトエラー等で原因を探れないか確認しましたがエラーは出ていませんでした。
そもそも
idref
という項目は何のための項目か検索を重ねRest APIの読み上げの為の項目らしいという所まではたどり着けたのですが、
当方Rest APIについては無知なので違うということだけはわかったのですが、ここで手詰まりになってしまいました。どうすれば、バージョン 5.5.6.1の時の様にバージョン 5.7.2でエラー位置を指定できるのか、どなたかご教授いただければ幸いです。`
- トピック「wpcf7_feedback_responseでエラー表示位置の指定方法」には新たに返信することはできません。