バリデーションのエラーメッセージが送信ボタン押下前から表示されてしまう

PHP初学者です。
ログインフォームを勉強がてら作成してみようと思いバリデーションの実装で躓いています。
下記のソースコードだと最初からエラーメッセージが表示されてしまいます。
ログインボタン押下後にエラーメッセージを表示するようにしたい場合、どこが間違えているのでしょうか？

php
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>ログイン</title>
7</head>
8<body>
9    <form method="post" action="login.php">
10    <label>ユーザー名</label>
11    <input type="text" name="user_name"><br>
12    <label>パスワード</label>
13    <input type="password" name="login_password">
14    <button type="submit" name="login_button">ログイン</button>
15    </form>
16</body>
17</html>
18
19<?php
20if(empty($_POST["user_name"])){
21    echo "ユーザー名を入力してください";
22}
23
24if(empty($_POST["login_password"])){
25    echo "パスワードを入力してください";
26}
27?>

行動規範の内容に同意します

回答1件

ベストアンサー

やりかたはいろいろあると思いますが、私なら次のように実装すると思います。

php
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="UTF-8">
5
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
8    <title>ログイン</title>
9  </head>
10
11  <body>
12    <form method="post" action="login.php">
13      <label>ユーザー名</label>
14
15      <input type="text" name="user_name"><br>
16
17      <label>パスワード</label>
18
19      <input type="password" name="login_password">
20
21      <button type="submit" name="login_button">ログイン</button>
22    </form>
23  </body>
24</html>
25
26<?php
27if (isset($_POST['user_name']) && empty($_POST['user_name'])) {
28  echo 'ユーザー名を入力してください';
29}
30
31if (isset($_POST['login_password']) && empty($_POST['login_password'])) {
32  echo 'パスワードを入力してください';
33}