実現したいこと
バリデーションを行い、エラーメッセージを表示させたい
発生している問題・エラーメッセージ
空文字でフォームを送信してもエラーメッセージが表示されない
該当のソースコード
<?php session_start(); $flag = 0; if(!empty($_POST['conf']) && empty($errors)) { $flag = 1; } if(!empty($_post['submit'])) { $flag = 2; } function validation($target) { $errors = []; if(empty($target['name']) || 20 < mb_strlen($target['name'])) { $errors[] = '名前を20文字以内で入力してください'; } if(empty($target['mail']) || !filter_var($target['mail'], FILTER_VALIDATE_EMAIL)) { $errors[] = 'メールアドレスを正しく入力してください'; } if(empty($target['tel']) || preg_match("/[^\d-]/", $target['tel'])) { $errors[] = '電話番号を正しく入力してください'; } return $errors; } validation($_POST); function hsc($str) { return htmlspecialchars($str, ENT_QUOTES, 'utf-8'); } ?> <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <link rel="stylesheet" href="css/ress.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/top.css"> <link rel="stylesheet" href="css/contact.css"> <link rel="stylesheet" href="css/animation.css"> </head> <body class="rel"> <header> <div class="icons"> <h1 class="header-logo"><a href="#"><img src="" alt=""></a></h1> <a href="#" class="cart f7--cart"></a> </div> <div class="hamb-wrap rel"> <div class="hamb" id="hamb"> <span class="hamb-line"></span> <span class="hamb-line"></span> <span class="hamb-line"></span> </div> </div> <nav class="header-nav" id="header-nav"> <ul> <li><a href="#"><p>Shampoo</p><p class="para">Conditioner</p></a></li> <li><a href="#">Bath Goods</a></li> <li><a href="#">Body Care</a></li> <li><a href="#">Room Goods</a></li> <li><a href="#">Contact</a></li> </ul> </nav> </header> <a href="#" class="scroll-top" id="scroll-top"> <p class="text">TOP</p> <p class="icon icon-park-outline--up-c"></p> </a> <main> <!-- フォーム --> <?php if($flag === 0): ?> <form action="contact.php" method="post"> <?php if(!empty($errors) && !empty($_POST['conf'])): ?> <?php echo '<ul class="error-list">'; ?> <?php foreach($errors as $error): ?> <?php echo '<li>'.$error.'</li>'; ?> <?php endforeach;?> <?php echo '</ul>'; ?> <?php endif; ?> <ul class="contact-list"> <li> <p class="title"> <label><span>必須</span>Name</label> </p> <p class="input"> <input type="text" name="name" id="name" value="<?php if(!empty($_POST['name'])) echo hsc($_POST['name']) ;?>"> </p> </li> <li> <p class="title"> <label><span>必須</span>Mail</label> </p> <p class="input"> <input type="email" name="mail" id="mail" value="<?php if(!empty($_POST['mail'])) echo hsc($_POST['mail']) ;?>"> </p> </li> <li> <p class="title"> <label><span>必須</span>Tel</label> </p> <p class="input"> <input type="tel" name="tel" id="tel" value="<?php if(!empty($_POST['tel'])) echo hsc($_POST['tel']) ;?>"> </p> </li> <!-- <li> <p class="title"> <label><span>必須</span>Message</label> </p> <p class="input"> <textarea name="message" id="message" cols="30" rows="10"></textarea> </p> </li> --> </ul> <p class="btn"><input type="submit" name="conf" value="Submit"></input></p> </form> <?php endif; ?> <!-- フォーム --> <!-- 確認 --> <?php if($flag === 1): ?> <form action="contact.php" method="POST"> <p class="conf-text">入力情報にお間違いはないですか？</p> <ul class="conf-list"> <li> <p>Name</p> <p><?php echo hsc($_POST['name']) ;?></p> </li> <li> <p>Mail</p> <p><?php echo hsc($_POST['mail']) ;?></p> </li> <li> <p>Tel</p> <p><?php echo hsc($_POST['tel']) ;?></p> </li> </ul> <input type="hidden" name="name" value="<?php hsc($_POST['name']) ;?>"> <input type="hidden" name="mail" value="<?php hsc($_POST['mail']) ;?>"> <input type="hidden" name="tel" value="<?php hsc($_POST['tel']) ;?>"> <div class="btns"> <p class="btn"><input type="submit" name="back" value="Back"></p> <p class="btn"><input type="submit" name="submit" value="OK"></p> </div> </form> <?php endif; ?> <!-- 確認 --> <!-- 送信 --> <?php if($flag === 2): ?> <p class="thanks">お問い合わせありがとうございます。</p> <?php endif; ?> <!-- 送信 --> </main> <footer> <nav class="footer-nav"> <a href="#">Shampoo Conditioner</a> <a href="#">Bath Goods</a> <a href="#">Body Care</a> <a href="#">Room Goods</a> <a href="#">Contact</a> </nav> <p class="copyright"><small>©</small></p> </footer> <script src="js/style.js"></script> </body> </html>
参考
https://qiita.com/sun_tomo/items/96d2f34cccd6f0bdca12
https://qiita.com/tochisuke221/items/e7f4a6ee7dfb5bd1f6b6
https://gray-code.com/php/make-the-form-vol7/
0 コメント