最終更新日：2022.08.24
公開日：2019.03.28

ワークショップ

ひと言掲示板を作る(7)

投稿の未入力バリデーションをつける

「ひと言掲示板」に投稿する際に、必要な入力項目をちゃんと入力されているか確認する機能を付けます。

この記事のポイント

empty関数で未入力バリデーションを作成する
未入力項目があったらファイルへの書き込みを行わないようする

メッセージがちゃんと入力されているか確認する

前回は掲示板に書き込み完了メッセージを表示する機能を作りました。
今回は「表示名」や「ひと言メッセージ」がちゃんと入力されているかを確認する「バリデーション」という機能を付けていきます。

現在の掲示板は「表示名」や「ひと言メッセージ」が入力されていない状態で「書き込む」ボタンを押すと、何も内容がない状態で投稿してしまいます。

未入力の投稿は多くの場合は入力忘れなどで起こります（中には意図的に未入力の場合もあります）。
そこで、今回は未入力の項目があったら次のようにお知らせする機能を付けていきます。

「ひと言掲示板を作る」の概要については「ひと言掲示板を作る」をご覧ください。
デモはこちら

前回までに作成したコードはこちら：Github

エラーメッセージを用意する

まずは未入力の項目があった場合に、お知らせするためのエラーメッセージを用意します。
メッセージを変数に用意する要領は前回の投稿完了メッセージと同様です。

ただし、今回は「表示名」と「ひと言メッセージ」の2つ以上入る可能性があるため、メッセージが入る変数$error_messageは配列形式にしておきます。

まずは「表示名」が未入力の場合にメッセージを設定していきましょう。

index.php

<?php

---- 省略 ----

// 変数の初期化
$current_date = null;
$data = null;
$file_handle = null;
$split_data = null;
$message = array();
$message_array = array();
$success_message = null;
$error_message = array();

if( !empty($_POST['btn_submit']) ) {

	// 表示名の入力チェック
	if( empty($_POST['view_name']) ) {
		$error_message[] = '表示名を入力してください。';
	}
	
	if( $file_handle = fopen( FILENAME, "a") ) {

		// 変数の初期化// 書き込み日時を取得
		$current_date = date("Y-m-d H:i:s");
	
		// 変数の初期化// 書き込むデータを作成
		$data = "'".$_POST['view_name']."','".$_POST['message']."','".$current_date."'\n";
	
		// 変数の初期化// 書き込み
		fwrite( $file_handle, $data);
	
		// 変数の初期化// ファイルを閉じる
		fclose( $file_handle);

		$success_message = 'メッセージを書き込みました。';
	}
}

---- 省略 ----

empty関数で表示名のデータが入っている$_POST['view_name']が空であるかを調べ、空だった場合に$error_messageへメッセージを代入しています。

シンプルですが、これで「表示名」が未入力であるかどうかをバリデーション（確認）する機能がつきました。
続いて、同じ要領で「ひと言メッセージ」についても未入力バリデーションをつけていきます。

index.php

<?php

---- 省略 ----

// 変数の初期化
$current_date = null;
$data = null;
$file_handle = null;
$split_data = null;
$message = array();
$message_array = array();
$success_message = null;
$error_message = array();

if( !empty($_POST['btn_submit']) ) {

	// 表示名の入力チェック
	if( empty($_POST['view_name']) ) {
		$error_message[] = '表示名を入力してください。';
	}

	// メッセージの入力チェック
	if( empty($_POST['message']) ) {
		$error_message[] = 'ひと言メッセージを入力してください。';
	}

	if( $file_handle = fopen( FILENAME, "a") ) {

		// 書き込み日時を取得
		$current_date = date("Y-m-d H:i:s");
	
		// 書き込むデータを作成
		$data = "'".$_POST['view_name']."','".$_POST['message']."','".$current_date."'\n";
	
		// 書き込み
		fwrite( $file_handle, $data);
	
		// ファイルを閉じる
		fclose( $file_handle);

		$success_message = 'メッセージを書き込みました。';
	}
}

---- 省略 ----

ひと言メッセージが入っている$_POST['message']が空であるかを調べ、空だった場合に$error_messageへメッセージを追加しています。
以上で、「表示名」と「メッセージ」が未入力であるかを確認するバリデーション機能を用意することができました。

メッセージを表示する

続いて、先ほど作成した$error_messageに値が入っていたらエラーメッセージとして表示するよう設定していきます。
HTMLの部分に、次の赤いコードを追記してください。

index.php

<?php

---- 省略 ----

<body>
<h1>ひと言掲示板</h1>
<?php if( !empty($success_message) ): ?>
	<p class="success_message"><?php echo $success_message; ?></p> 
<?php endif; ?>
<?php if( !empty($error_message) ): ?>
	<ul class="error_message">
		<?php foreach( $error_message as $value ): ?>
			<li>・<?php echo $value; ?></li>
		<?php endforeach; ?>
	</ul>
<?php endif; ?>
<form method="post">
	<div>
		<label for="view_name">表示名</label>
		<input id="view_name" type="text" name="view_name" value="">
	</div>
	<div>
		<label for="message">ひと言メッセージ</label>
		<textarea id="message" name="message"></textarea>
	</div>
	<input type="submit" name="btn_submit" value="書き込む">
</form>

---- 省略 ----

empty関数を使って変数に値が入っているかを確認する部分は投稿完了メッセージと同様です。
しかし今回の変数$error_messageは配列形式になっているため、foreach文を使って配列の値の数だけメッセージを表示するようにします。

<?php foreach( $error_message as $value ): ?>
	<li>・<?php echo $value; ?></li>
<?php endforeach; ?>

ここで、$error_messageから1つずつ値を取り出して$valueに代入し、そのままli要素の中にecho関数で出力しています。
foreach文によって、エラーメッセージが1つでも、2つ以上ある場合でも同じようにメッセージを表示できるようになりました。

ここまで未入力項目がある場合に限り、「入力してください」とメッセージを表示してお知らせできるようになりました。

未入力項目があると書き込みしないようにする

最後に、「表示名」か「ひと言メッセージ」のいずれかが未入力だった場合に、ファイルへの書き込みを行わないように設定していきます。

未入力の項目があったかを確認する方法として、$error_messageが空であるかを確認して行います。
バリデーションを行った後に、$error_messageに値が入っていなければ未入力の項目はなかったと判断することができます。

そこで、次のように赤字のコードを追記してください。

index.php

<?php

---- 省略 ----

if( !empty($_POST['btn_submit']) ) {

	// 表示名の入力チェック
	if( empty($_POST['view_name']) ) {
		$error_message[] = '表示名を入力してください。';
	}

	// メッセージの入力チェック
	if( empty($_POST['message']) ) {
		$error_message[] = 'ひと言メッセージを入力してください。';
	}

	if( empty($error_message) ) {

		if( $file_handle = fopen( FILENAME, "a") ) {
	
			// 書き込み日時を取得
			$current_date = date("Y-m-d H:i:s");
		
			// 書き込むデータを作成
			$data = "'".$_POST['view_name']."','".$_POST['message']."','".$current_date."'\n";
		
			// 書き込み
			fwrite( $file_handle, $data);
		
			// ファイルを閉じる
			fclose( $file_handle);
	
			$success_message = 'メッセージを書き込みました。';
		}
	}
}

---- 省略 ----

ここでもempty関数が登場します。
こちらの関数は変数の値の有無に加えて、変数がそもそも存在するかを確認することができるため非常に便利です。

以上で、未入力の項目があった場合にはメッセージが表示され、書き込みも行われないようになりました。
次回は入力されたデータの「サニタイズ」という、システムのセキュリティを考慮した機能を加えていきます。

今回作成したコード：Github

こちらの記事は役に立ちましたか？

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます！
運営の参考にさせていただきます。

投稿の未入力バリデーションをつける

この記事のポイント

目次

メッセージがちゃんと入力されているか確認する

エラーメッセージを用意する

index.php

index.php

メッセージを表示する

index.php

未入力項目があると書き込みしないようにする

index.php

こちらの記事は役に立ちましたか？

記事一覧