WordPressの管理画面でチェックボックスを追加すると「Notice: Undefined index」が出る問題の解決法

WordPressではプラグインやテーマ用に独自の管理画面を追加することができます。管理画面の追加は今まで何回もやってきていたのですが、先日初めてチェックボックスを使ったところ、大量の「Notice: Undefined index」が出て焦りました。

その時の対処方法を防備録として書いておきます。Noticeは致命的なエラーではなく”望ましくないコード”という意味なのででそのままでも動きますが、エラーでているのは気持ち悪いですからね。

エラーがでる原因

「Notice: Undefined index」というのは定義されてない配列要素を使用した場合に発生します。ちなみに定義していない変数を使用した場合は「Notice: Undefined variable」というエラーが出ます。

今回大量にエラーがでたのは管理画面の保存ボタンをクリックしたときです。

テキストボックスやラジオボタンでは何も選択されていない場合でもデータは送られます。
例えば下記のようなテキストボックスがあったとします。

[html]<input type="text" name="hogehoge" value="">[/html]

たとえ入力されず空の状態であっても保存をクリックすると「name=hogehogeの値は空だよ」というデータは送られます。そのおかげでWordPress側で送られてきたデータを保存するときに、この情報を元にhogehogeという配列要素の値が保存されます。

ところがチェックボックスはチェックが入っていないと何も送信されません。

[html]<input type="checkbox" name="hoge" value="OK">[/html]

とあった場合にチェックが入っていないと「hogeは空だよ」という情報は送られず、このチェックボックスに関する情報は何も送られません。存在自体が無いことにされてしまいます。これはHTMLの仕様です。

そうなるとhoge自体が存在しないことになっているので、hogeの値を保存しようとしても「hogeなんて要素はないぞ」と怒られてしまいます。これがエラーの原因ですね。

一応、エラーが出ていてもその配列に値が設定されないだけで処理は進みますし、テンプレートも正常に動きます。

色々調べると、一般的な解決法としてはif文とissetを使ったチェック方法がでてくるのですが、今回問題となる配列要素が沢山あるので面倒くさそう（関数にすればよいのですが）に感じました。

そこでもう少し簡単な方法はないかと探していたら、下記のサイトで「ハック的な方法だが･･･」と注釈付きでtyep=”hidden”を使った方法が掲載されていました。

方法はとてもシンプル。下記のようにチェックボックスの前にhiddenを指定したinput要素を置きます。そうすると、チェックが入っていないときはhiddenの方のvalueが送られ、チェックが入っているときはチェックボックスの方のvalueが送られます。

[html]
<input type="hidden" name="hoge" value="0">
<input type="checkbox" name="hoge" value="OK">
[/html]

ポイントは、hiddenの方を必ず先に書くこと。順番が逆になると常にhiddenの値が返ってしまうので注意してください。

とてもシンプルで分かりやすいのでWordPressの管理画面にチェックボックスを設置するときはこの方法がオススメかなと思います。