[wordpress] contactform7 で エラー文言の表示位置が変更できない

Question

###前提・実現したいこと
wordpressのプラグイン「contactform7」でフォームを作成する際に
必須項目のエラー表記を出す位置をカスタマイズしたい。

###発生している問題・エラーメッセージ
郵便番号の上三桁、下四桁など入力項目を分割してかつ横並びにし、
それぞれ必須項目とすると、意図しない位置にエラー表示が出てしまいレイアウトが崩れてしまう。

###該当のソースコード
フォームのコード：

<p>お名前 (必須)<br />
    [text* your-name] </p>
<p>好きなもの (必須)<br />
    [checkbox* fav "りんご" "みかん" "バナナ" "その他"][text fav-etc]
    <span class="wpcf7-custom-item-error fav"></span>
</p>
<p>[submit "送信"]</p>

punction.php の記述：

function wpcf7_custom_item_error_position( $items, $result ) {
	// メッセージを表示させたい場所のタグのエラー用のクラス名
	$class = 'wpcf7-custom-item-error';
	// メッセージの位置を変更したい項目名
	$names = array( 'fav' );

	// 入力エラーがある場合
	if ( isset( $items['invalids'] ) ) {
		foreach ( $items['invalids'] as $k => $v ) {
			$orig = $v['into'];
			$name = substr( $orig, strrpos($orig, ".") + 1 );
			// 位置を変更したい項目のみ、エラーを設定するタグのクラス名を差替
			if ( in_array( $name, $names ) ) {
				$items['invalids'][$k]['into'] = ".{$class}.{$name}";
			}
		}
	}
	return $items;
}
add_filter( 'wpcf7_ajax_json_echo', 'wpcf7_custom_item_error_position', 10, 2 );

###試したこと
http://wpcj.net/1130 を参考にまずはテストコードをそのまま入力してみましたが、
エラー表記の位置が変わりませんでした。。

###補足情報(言語/FW/ツール等のバージョンなど)
wordpress 4.9.1
contactform7 4.9.1

Answer 1

バージョンによって、$itemsの値が変わっているのだと思います。

Array
(
    [into] => #wpcf7-f5-p24-o1
    [status] => validation_failed
    [message] => 入力内容に問題があります。確認して再度お試しください。
    [invalidFields] => Array
        (
            [0] => Array
                (
                    [into] => span.wpcf7-form-control-wrap.fav
                    [message] => 必須項目に入力してください。
                    [idref] => 
                )
        )
)

functions.phpに記載の $items['invalids'] 箇所を $items['invalidFields'] に変更して動かないでしょうか？

function wpcf7_custom_item_error_position( $items, $result ) {
	$class = 'wpcf7-custom-item-error';
	$names = array( 'fav');
	
	if ( isset( $items['invalidFields'] ) ) {
		foreach ( $items['invalidFields'] as $k => $v ) {
			$orig = $v['into'];
			$name = substr( $orig, strrpos($orig, ".") + 1 );
			if ( in_array( $name, $names ) ) {
				$items['invalidFields'][$k]['into'] = ".{$class}.{$name}";
			}
		}
	}
	return $items;
}
add_filter( 'wpcf7_ajax_json_echo', 'wpcf7_custom_item_error_position', 10, 2 );

Comments

[amagimagi]

期待していた動作になりました！
こちらを元にカスタマイズしたいと思います。
誠にありがとうございました！！