【 PHP学習＃20 】バリデーション＃2　FIREへの旅路 ♯470

S.A.P.Studio

2022年7月18日 16:21

前回までに作成したフォームに、バリデーション機能を追加していきます。

【バリデーション】

今回は、氏名の項目が空白の場合に、「氏名は必須です」というお知らせが
フォームの上部に表示されるようにします。

【全コード】

input.php

<?php

session_start();

//validation.php ファイルの読み込み ・・・・・・解説②
require 'validation.php';


header( 'X-FRAME-OPTIONS:DENY' );

//スーパーグローバル変数
if ( !empty( $_POST ) ) {

  echo '<pre>';

  var_dump( $_POST );

  echo '</pre>';

}


function h( $str ) {
  return htmlspecialchars( $str, ENT_QUOTES, 'UTF-8' );
}


//入力画面=0、確認画面=1、完了画面=2 
//表示する内容を切り替える条件を設定する
$pageFlag = 0;


// バリデーション用 コード  ・・・・・・・解説③
$errors = validation($_POST);


// pageFlagの変更条件を追加  ・・・・・・・解説④
if ( !empty( $_POST[ 'btn_confirm' ] )  && empty($errors)) {
  $pageFlag = 1;
}

if ( !empty( $_POST[ 'btn_submit' ] ) ) {
  $pageFlag = 2;
}


?>

<!DOCTYPE html>
<meta charset="utf-8">
<head>
</head>
<body>

<!--入力画面-->
<?php if($pageFlag === 0) : ?>

<!--csrfトークンの生成-->
<?php
if ( !isset( $_SESSION[ 'csrfToken' ] ) ) {
  $csrfToken = bin2hex( random_bytes( 32 ) );
  $_SESSION[ 'csrfToken' ] = $csrfToken;
}
$token = $_SESSION[ 'csrfToken' ]
?>
	
<!--エラーメッセージを表示する   ・・・・・・・解説⑤-->
<?php if(!empty($errors) && !empty($_POST ['btn_confirm'])) :?>
<?php echo '<ul>' ;?>
<?php 
	foreach($errors as $error ){
		echo '<li>' .  $error . '</li>' ;
	}
?>
	
<?php echo '</ul>' ;?>
	
	
<?php endif; ?>
	
	
	
	
	
<form method="POST" action="input.php">
  氏名
  <input type="text" name="your_name" value="<?php if(!empty($_POST['your_name'])) {echo h($_POST['your_name']);} ?>">
  <br>
  メールアドレス
  <input type="text" name="email" value="<?php if(!empty($_POST['email'])) {echo h($_POST['email']);} ?>">
  <br>
  ホームページ
  <input type="url" name="url" value="<?php if(!empty($_POST['url'])) {echo h($_POST['url']);} ?>">
  <br>
  性別
  <input type="radio" name="gender" value="0"
  <?php if(isset($_POST['gender']) && $_POST['gender'] ===  '0') { echo 'checked';} ?>>男性
  
  <input type="radio" name="gender" value="1"
  <?php if(isset($_POST['gender']) && $_POST['gender'] ===  '1') { echo 'checked';} ?>>女性 
	
  <br>
	
  年齢
  <select name="age">
    <option value="">選択してください</option>
    <option value="1" <?php if(isset($_POST['age']) && $_POST['age'] === '1' )  { echo 'selected'; } ?>>〜19歳</option>
    <option value="2" <?php if(isset($_POST['age']) && $_POST['age'] === '2' )  { echo 'selected'; } ?>>20歳〜29歳</option>
    <option value="3" <?php if(isset($_POST['age']) && $_POST['age'] === '3' )  { echo 'selected'; } ?>>30歳〜39歳</option>
    <option value="4" <?php if(isset($_POST['age']) && $_POST['age'] === '4' )  { echo 'selected'; } ?>>40歳〜49歳</option>
    <option value="5" <?php if(isset($_POST['age']) && $_POST['age'] === '5' )  { echo 'selected'; } ?>>50歳〜59歳</option>
    <option value="6" <?php if(isset($_POST['age']) && $_POST['age'] === '6' )  { echo 'selected'; } ?>>60歳〜</option>
  </select>
  <br>
  お問い合わせ内容
  <textarea name="contact">
	  <?php if(!empty($_POST['contact'])) {echo h($_POST['contact']);} ?>
  </textarea>
  <br>
  <input type="checkbox" name="caution" value="1">
  注意事項にチェックする <br>
  <input type="submit" name="btn_confirm" value="確認する">
  
  <!--csrfトークンを仕込む-->
  <input type="hidden" name="csrf" value="<?php echo $token; ?>" >
</form>
<?php endif; ?>

	
	
<!--確認画面-->
<?php if($pageFlag === 1) :?>

<!--POSTのcsrfとSESSIONのcsrfがあっているか判定する-->
<?php if($_POST['csrf'] === $_SESSION['csrfToken']): ?>
<form method="POST" action="input.php">
	
  氏名 <?php echo h($_POST['your_name']);?> 
	
  <br>
	
  メールアドレス <?php echo h($_POST['email']);?> 
	
  <br>
	
  ホームページ<?php echo h($_POST['url']);?> 
	
  <br>
	
  性別
  <?php
	if($_POST['gender'] === '0'){echo '男性';}
	if($_POST['gender'] === '1'){echo '女性';}
  ?> 
	
  <br>
	
  年齢
  <?php
	if($_POST['age'] === '1'){echo '〜19歳';}
	if($_POST['age'] === '2'){echo '20歳〜29歳';}
	if($_POST['age'] === '3'){echo '30歳〜39歳';}
	if($_POST['age'] === '4'){echo '40歳〜49歳';}
	if($_POST['age'] === '5'){echo '50歳〜59歳';}
	if($_POST['age'] === '6'){echo '60歳〜';}
  ?> 
	
	
  <br>
	
  問い合わせ内容<?php echo h($_POST['contact']);?> 
	
  <br>
	

  
  <!--戻るボタン-->
  <input type="submit" name="back" value="戻る">
  
  <!--送信ボタン-->
  <input type="submit" name="btn_submit" value="送信する">
	
  <!--入力内容を保存-->
  <input type="hidden" name="your_name" value="<?php echo h($_POST['your_name']);?>" >
  <input type="hidden" name="email" value="<?php echo h($_POST['email']);?>" >
  <input type="hidden" name="url" value="<?php echo h($_POST['url']);?>" >
  <input type="hidden" name="gender" value="<?php echo h($_POST['gender']);?>" >
  <input type="hidden" name="age" value="<?php echo h($_POST['age']);?>" >
  <input type="hidden" name="contact" value="<?php echo h($_POST['contact']);?>" >
	
  
  <!--$pageFlagが０から１に変わる時にcsrfの値も消えるので、保存しておく-->
  <input type="hidden" name="csrf" value="<?php echo h($_POST['csrf']);?>" >
</form>
<?php endif; ?>
<?php endif; ?>

<!--完了画面-->
<?php if($pageFlag === 2) : ?>

<!--POSTのcsrfとSESSIONのcsrfが一致しているか判定する-->
<?php if($_POST['csrf'] === $_SESSION['csrfToken']): ?>
送信が完了しました 

<!--トークンを削除する-->
<?php unset($_SESSION['csrfToken']); ?>
<?php endif; ?>
<?php endif; ?>
</body>
</html>

validation.php



<?php

//validation.php・・・・・・解説①

function validation($request){ //$_POST連想配列が入る
	
	$errors = [];
	
	if(empty($reqest['your_name'])){
		
		$errors[] = '氏名は必須です';
		
	}
	
	return $errors;
}

?>

validation.phpというバリデーション用のファイルを追加しています。

・解説 ①

validation.phpというファイルを作ります。

中身のコードはこのようにします

<?php

function validation($request){  //$_POST連想配列が入る
	
	$errors = [];
	
	if(empty($request['your_name'])){
		
		$errors[] = '氏名は必須です';
		
	}
	
	return $errors;
}

?>

function validation　で、validationという関数を作ります。

引数は、$request にします。

$errors = [ ] ; 　としておき、
$errors に ’氏名は必須です’ などのエラーメッセージが配列で入るようにしておきます。

続いて、$errors に ’氏名は必須です’ などのメッセージを入れる条件を
if文で書きます。

もし（if）
$requestの連想配列のキー'your_name'の値が
空だったら（empty）

$errors の　配列[ ] に '氏名は必須です'　という値をを入れて

その値が入った　$errors　を　出力(return)　する

・解説 ②

input.phpで、validation.phpを読み込みます。

//validation.phpの読み込み
require 'validation.php';

・解説 ③

$pageFlagの下あたりにコードを追加します。

//入力画面=0、確認画面=1、完了画面=2 
//表示する内容を切り替える条件を設定する
$pageFlag = 0;


// バリデーション用 コード  ・・・・・・・解説③
$errors = validation($_POST);

$errors という変数を作り、
解説①で作った、関数validation を使います。
ここで、引数に $_POST を入れます。

これにより、POST通信で送信される、氏名などの入力内容が値となり、
連想配列で入ることになります。

そして、関数 validationで、処理されて、$_POSTの値がemptyであれば、
$errorsに、'氏名は必須です'　などのエラーメッセージを
配列の値として格納して、returnします。

・解説 ④

pageFlagが、０から１に変わる条件を追加します。
つまり、入力画面から、確認画面に変わる条件を追加します。

// pageFlagの変更条件を追加  ・・・・・・・解説④
if ( !empty( $_POST[ 'btn_confirm' ] )  && empty($errors)) {
  $pageFlag = 1;
}

&& empty($errors)　この条件が追加されました。

&&　なので、「○○ かつ ●●」という条件追加です。

$errors が empty だったらという条件を追加です。

$errors　に値がなかったら、pageFlagを１にするということです。

・解説⑤

入力画面に、エラーメッセージを表示させるためのコードです。

<!--エラーメッセージを表示する   ・・・・・・・解説⑤ -->
<?php if(!empty($errors) && !empty($_POST ['btn_confirm'])) :?>
<?php echo '<ul>' ;?>
<?php 
	foreach($errors as $error ){
		echo '<li>' .  $error . '</li>' ;
	}
?>
	
<?php echo '</ul>' ;?>
	
	
<?php endif; ?>

phpのif文で、エラーメッセージを表示する条件を書きます。

もし（ if ）
$errorsが
空じゃない（ !empty ）　→ 　エラーがあるとき
かつ（ && ）
$_POST の 'btn_confirm' が
空じゃない（ !empty ）　→　確認ボタンを押したとき

<ul></ul>をechoする　　→　<ul>タグを書く

$errors　の配列から、値をひとつづつ取り出し、
$error　に格納するを繰り返す（ foreach ）

そして、その値を、<li>タグに入れる
echo '<li>' . $error . '</li>'

このように、<ul>タグと、<li>タグを使って、リスト化するのは、
氏名以外の項目も、エラーがある場合に、
$errorsの配列にいくつかの値が格納されるため、
これをforeachで順に取り出して、リスト化させるためです。

・確認

ブラウザで確認します。

氏名欄を空白で「確認する」ボタンを押すと

このように、表示されます。

【まとめ】

バリデーションを設定しました。

今回は、氏名のところに簡易的なエラーメッセージを表示させました。

次回は、さらに追加していきます！！

この記事が気に入ったらサポートをしてみませんか？

【 PHP学習 ＃20 】 バリデーション＃2 FIREへの旅路 ♯470

【 バリデーション 】

【 全コード 】

input.php

validation.php

・ 解説 ①

・ 解説 ②

・ 解説 ③

・ 解説 ④

・ 解説⑤

・ 確認

【 まとめ 】