LaravelのバリデーションエラーをBladeで表示する方法
生徒
「Laravelでフォームの入力が間違っていた場合、ユーザーにエラーを表示したいです。どうやるんですか?」
先生
「Laravelでは、バリデーションを使うとエラー情報を自動で保持してくれるので、Bladeテンプレートで簡単に表示できます。」
生徒
「具体的にはどのようにBladeでエラーを表示するんですか?」
先生
「それでは、順を追って見ていきましょう。」
1. バリデーションとは?
バリデーションとは、ユーザーがフォームに入力した内容が「正しい形」になっているかをチェックする仕組みです。たとえば、メールアドレスがメールの形式になっているか、必須項目が空のまま送信されていないか、文字数が長すぎないかなどを確認します。Laravelのバリデーションを使うと、間違った入力をそのまま保存せずに止められるため、データの品質が上がり、フォームの入力ミスも減らしやすくなります。Laravelでは$request->validate()を使うことで、初心者でも短い記述でバリデーションを実装できます。
初心者向けの超シンプル例(「名前は必須」だけチェック)
$request->validate([
'name' => 'required',
]);
この例では、フォームのnameが空のまま送信されたらエラーになります。つまり「入力が足りない状態で登録処理に進まない」ようにできるので、ユーザー登録フォームやお問い合わせフォームなどで安全に入力チェックを行えます。
2. バリデーションの設定例
ユーザー登録フォームでは、「名前は必須」「メールアドレスはメール形式」といった入力ルールを決めておくと、間違ったデータが保存されにくくなります。Laravelでは、コントローラー側で$request->validate()にルールを書くだけで、送信された値を自動でチェックできます。
たとえば、名前(name)とメールアドレス(email)を必須にして、さらに「文字数」や「形式」も確認したい場合は次のように設定します。
$request->validate([
'name' => 'required|string|max:50',
'email' => 'required|email|max:255',
]);
それぞれのルールの意味(初心者向け)
required:未入力(空)のまま送信されたらエラーstring:文字列として扱える内容かをチェック(名前の想定に近づける)max:50:50文字を超えたらエラー(長すぎる入力を防ぐ)email:メールアドレスの形式かをチェック(例:@がない等を弾く)max:255:255文字を超えたらエラー(極端に長いメールを防ぐ)
この設定で、nameとemailが入力されていない場合や、文字数オーバー、メール形式が間違っている場合にエラーが発生します。つまり「入力ミスがある状態では登録処理に進まない」ようにできるため、登録フォームのトラブルや問い合わせ対応の手間も減らしやすくなります。
3. Bladeでバリデーションエラーを表示する方法
Laravelでバリデーションに失敗すると、エラーメッセージは自動的に$errorsに入ります。あとはBlade側で「どの入力欄でエラーが出たか」を指定して表示するだけです。入力欄のすぐ下にエラーを出しておくと、ユーザーもどこを直せばいいか迷いません。
一番よく使われるのが@errorディレクティブです。対象のフィールドにエラーがあるときだけ表示されるので、余計な分岐を書かずに済みます。
<form method="POST" action="/register">
@csrf
<div class="mb-3">
<label for="name" class="form-label">名前</label>
<input type="text" class="form-control" id="name" name="name" value="{{ old('name') }}">
@error('name')
<div class="text-danger">{{ $message }}</div>
@enderror
</div>
<div class="mb-3">
<label for="email" class="form-label">メールアドレス</label>
<input type="email" class="form-control" id="email" name="email" value="{{ old('email') }}">
@error('email')
<div class="text-danger">{{ $message }}</div>
@enderror
</div>
<button type="submit" class="btn btn-primary">登録</button>
</form>
初心者向け:この部分が何をしているか
@error('name'):名前(name)にエラーがあるときだけ中身を表示します。{{ $message }}:Laravelが用意したエラーメッセージが自動で入ります。- 表示場所を入力欄の直下にすると、フォームのバリデーションエラーが見つけやすくなります。
ポイントは、@error('フィールド名')の「フィールド名」を、フォームのname="..."と同じにすることです。ここが一致していれば、登録フォームでも問い合わせフォームでも同じ書き方でスムーズにエラーメッセージを表示できます。
4. old関数で入力値を保持する
バリデーションでエラーが発生した場合、フォームの入力内容を保持したいことがあります。その場合はold('フィールド名')を使います。先ほどの例では、value="{{ old('name') }}"としているので、エラー後もユーザーが入力した値が残ります。
5. すべてのエラーをまとめて表示する方法
特定のフィールドごとではなく、フォーム全体のエラーをまとめて表示することもできます。
@if ($errors->any())
<div class="alert alert-danger">
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
$errors->any()は、エラーが1件以上あるかどうかを判定します。$errors->all()で全てのエラーメッセージを取得してリスト表示します。
6. 注意点
- フォーム送信時には必ず
@csrfを入れてセキュリティを保護する。 - バリデーションエラーの表示はユーザーに分かりやすくすることが重要。
- old関数を使ってユーザーの入力値を保持することで、再入力の手間を減らせる。