CodeIgniterバリデーションエラーメッセージ表示ガイド!初心者向け徹底解説
生徒
「お問い合わせフォームを作っているのですが、入力漏れがあった時に『名前を入力してください』と赤文字で出すにはどうすればいいですか?」
先生
「それは『バリデーション』という仕組みを使います。CodeIgniterには、入力内容をチェックして、自動でエラーメッセージを出してくれる便利な機能があるんですよ。」
生徒
「難しそうですね…。初心者でも簡単に表示させる方法はありますか?」
先生
「大丈夫です!まずは基本的な仕組みから、実際の表示方法まで順番に解説していきますね。一歩ずつ進めば必ずマスターできますよ!」
1. バリデーションとは何?
プログラミングの世界でよく聞くバリデーション(Validation)という言葉ですが、これは日本語で「妥当性の確認」や「入力チェック」という意味です。例えば、会員登録フォームでメールアドレスの欄が空っぽだったり、電話番号の欄に漢字が入力されていたりしたら困りますよね。そういった「正しくない入力」をプログラムが自動で見つけ出し、「ここが間違っていますよ!」と教えてあげる機能がバリデーションです。
CodeIgniter(コードイグナイター)というPHPのフレームワーク(アプリ開発の土台となる道具セット)を使えば、このチェック機能をとても楽に作ることができます。ユーザーが間違った入力をしたときに、どの項目がどう間違っているのかを画面に表示させるまでが、バリデーションの一連の流れになります。パソコンを触り始めたばかりの方でも、まずは「入力ミスを指摘してくれる優しい監視員さん」のようなものだとイメージしてください。
2. エラーメッセージを一括で表示する方法
まずは、画面の一番上に「どこが間違っているか」をまとめて表示する方法を見ていきましょう。CodeIgniterでは list_errors() という命令(メソッド)を使うことで、発生したすべてのエラーメッセージを箇条書きのリスト形式で自動的に作成してくれます。これをフォームの近くに配置するだけで、ユーザーは自分のミスを一度に確認できるようになります。
この方法は、設定がとても簡単なので、開発を始めたばかりの初心者の方に最もおすすめの表示スタイルです。デザインの調整も後からCSSで行うことができますが、まずは標準の出力結果を確認してみましょう。PHPのプログラムの中に、HTMLのタグを混ぜて書いていくことになります。
<div class="alert alert-danger">
<?= validation_list_errors() ?>
</div>
<form action="/contact/send" method="post">
<label for="username">お名前:</label>
<input type="text" name="username" id="username">
<label for="email">メールアドレス:</label>
<input type="email" name="email" id="email">
<button type="submit">送信する</button>
</form>
上記のコードにある validation_list_errors() が、魔法の言葉です。これがあるだけで、CodeIgniterが裏側でエラーを探し、もしエラーがあれば ul タグや li タグといった箇条書きのHTMLに変換して画面に出してくれます。alert alert-danger は、画面を赤色にして「警告」っぽく見せるための装飾(CSSクラス)です。
3. 各入力項目のすぐ下にエラーを表示する
次に、より親切な入力フォームを作る方法です。全てのミスを上にまとめて表示するのではなく、名前の入力欄の下には名前のエラー、メールアドレスの下にはメールのエラーをそれぞれ個別に表示させたいですよね。これを「個別エラー表示」と呼びます。CodeIgniterでは show_error() という命令を使って、特定の項目(フィールド名)を指定して表示させます。
この方法を使うと、ユーザーは「どこを直せばいいか」を直感的に理解できるようになります。視線の移動が少なくて済むため、使いやすい(ユーザーフレンドリーな)サイト制作には欠かせないテクニックです。実際のコードの書き方を見て、各項目の紐付け方を学びましょう。
<form action="/user/register" method="post">
<div>
<label>ユーザー名</label>
<input type="text" name="nickname">
<span class="text-danger"><?= validation_show_error('nickname') ?></span>
</div>
<div>
<label>パスワード</label>
<input type="password" name="passcode">
<span class="text-danger"><?= validation_show_error('passcode') ?></span>
</div>
<input type="submit" value="登録">
</form>
ここで注目してほしいのは、validation_show_error('nickname') という部分です。カッコの中に入力欄の「名前(name属性)」を書くことで、その項目専用のエラーメッセージだけをピンポイントで呼び出すことができます。もしエラーがない場合は何も表示されないので、HTMLが崩れる心配もありません。
4. コントローラー側でのバリデーション設定
画面にエラーを表示させるためには、そもそも「何が正しい入力なのか」というルールをサーバー(プログラムの裏側)で決めておく必要があります。これを担当するのがコントローラーという役割のファイルです。ここで「この項目は必須です」「これはメールアドレスの形式にしてください」といったルールを定義します。
初心者が特につまずきやすいのが、このルール設定です。しかし、CodeIgniter 4以降では validate() という関数の中に連想配列(名前とルールのセット)を書くだけで完了します。非常にシンプルですので、以下の例を見て、ルールをどのように指定するのかを確認してください。PHPの文法である「配列」を意識しながら読んでみましょう。
public function store()
{
// 1. ルールの設定
$rules = [
'username' => 'required|min_length[3]',
'email' => 'required|valid_email',
];
// 2. チェックの実行
if (! $this->validate($rules)) {
// チェックに引っかかった(エラーあり)
// 入力画面を再度表示する(エラーメッセージも一緒に渡される)
return view('contact_form');
}
// 3. 成功した場合の処理
echo "送信が完了しました!";
}
このコードの中の required は「必須入力」という意味で、min_length[3] は「最低3文字以上入力してください」という意味です。また、valid_email は「ちゃんとしたメールアドレスの形(@があるか等)になっているか」をチェックしてくれます。もしこれらの条件を満たさないと、自動的にエラーが発生し、先ほど解説したビュー(画面側)のコードにメッセージが送られる仕組みになっています。
5. エラーメッセージの文言を日本語に変更する
標準のままだと、エラーメッセージは「The username field is required.」のように英語で表示されてしまいます。日本のユーザー向けのサイトなら、「お名前は必須です」と日本語で表示させたいですよね。これをカスタマイズする方法はいくつかありますが、最も手軽なのはルールの設定時に一緒にメッセージも書いてしまう方法です。
プログラミング未経験の方にとって、英語のエラーは壁に感じがちですが、日本語に変えることで一気に自分のプログラムが「サービス」らしく見えてきます。配列の中に errors という項目を作り、どのルールに対してどの文章を出すかを指定していきます。少しコードが長くなりますが、型が決まっているので真似するだけで大丈夫です。
$rules = [
'product_name' => [
'label' => '商品名',
'rules' => 'required',
'errors' => [
'required' => '{field}を入力し忘れていませんか?確認してくださいね。',
],
],
];
if (! $this->validate($rules)) {
return view('product_add');
}
実行結果は以下のようになります。{field} という部分は、自動的に「商品名」というラベルに置き換わります。こうすることで、温かみのあるオリジナルなメッセージを作ることができます。
商品名を入力し忘れていませんか?確認してくださいね。
6. フォームに以前の入力を残しておく方法
エラーメッセージを表示させる際、もう一つ重要なのが「入力内容を消さないこと」です。せっかく長い文章を書いたのに、エラーで画面が戻った瞬間に中身が空っぽになっていたら、ユーザーはやる気をなくしてサイトを離れてしまいます。これを防ぐために、CodeIgniterには old() という便利な道具が用意されています。
これは「さっき入力した値をもう一度出してね」という命令です。バリデーションエラーを表示させるのとセットで覚えることで、プロ並みの親切なフォームを作ることができるようになります。value 属性の中にこの関数を書き込むだけで、データの保持が自動化されます。HTMLの属性についても学びながら、コードを確認してみましょう。
<div class="mb-3">
<label>コメント</label>
<textarea name="comment" class="form-control"><?= old('comment') ?></textarea>
<p class="text-danger"><?= validation_show_error('comment') ?></p>
</div>
これで、万が一バリデーションで弾かれてしまっても、ユーザーは最初から書き直す必要がなくなります。エラーメッセージの表示と、この「入力値の保持(old関数)」は、常にペアで使うものだと覚えておきましょう。これができるようになれば、初心者から一歩抜け出して、実用的なウェブアプリケーション開発の仲間入りです!