投稿の文字数を設定する
前回は掲示板への投稿について、ブラウザのリロード（再読み込み）によって多重送信されてしまうのを防ぐ機能を実装しました。
当ワークショップの最終回となる今回は、投稿できるひと言メッセージの文字数を設定していきます。
以下の例はやや極端ですが、最大文字数を10文字に設定して11文字以上の時に投稿をしようとしたときのブラウザ表示例です。
ここで、投稿するメッセージの末尾から「さ」を削除してもう1度投稿してみます。
今度はちょうど10文字だったので投稿することができました。
すでに未入力のバリデーションを実装していますが、今回は最大文字数のバリデーションを追加していきます。
「ひと言掲示板を作る」の概要については「ひと言掲示板を作る」をご覧ください。
デモはこちら
前回までに作成したコードはこちら：Github
投稿されたメッセージの文字数をカウントする
今回は投稿された「ひと言メッセージ」の文字数を数える必要がありますが、ここではmb_strlen関数を使います。
この関数は第1パラメータに渡した文字列の数を整数（int）で返します。
第2パラメータはオプションで文字コードを指定することができます。
mb_strlen関数
mb_strlen( $message, 'UTF-8');もし変数$messageに入っている文字列が「testテスト」なら「int(7)」が返り値となり、「testテスト1234567890」の場合は「int(17)」が返り値になります。
文字列は半角、全角が混ざっていても大丈夫です。
改行も1文字として扱われます。
最大文字数のバリデーションを実装
文字数のカウント方法がわかったところで、さっそく掲示板に実装していきましょう。
ひと言メッセージの投稿データを入力チェックするif文に、新しくelse文を追加します。
「index.php」を開き、以下の赤字のコードを追記してください。
index.php
<?php
---- 省略 ----
if( !empty($_POST['btn_submit']) ) {
// 空白除去
$view_name = preg_replace( '/\A[\p{C}\p{Z}]++|[\p{C}\p{Z}]++\z/u', '', $_POST['view_name']);
$message = preg_replace( '/\A[\p{C}\p{Z}]++|[\p{C}\p{Z}]++\z/u', '', $_POST['message']);
// 表示名の入力チェック
if( empty($view_name) ) {
$error_message[] = '表示名を入力してください。';
} else {
// セッションに表示名を保存
$_SESSION['view_name'] = $view_name;
}
// メッセージの入力チェック
if( empty($message) ) {
$error_message[] = 'ひと言メッセージを入力してください。';
} else {
// 文字数を確認
if( 100 < mb_strlen($message, 'UTF-8') ) {
$error_message[] = 'ひと言メッセージは100文字以内で入力してください。';
}
}
if( empty($error_message) ) {
// 書き込み日時を取得
$current_date = date("Y-m-d H:i:s");
---- 省略 ----このコードでは最大文字数を「100文字」にしています。
mb_strlen関数の返り値と「100」を比較し、もし$messageに入っている文字列の数が101文字以上だったときはエラーメッセージを設定します。
続いて、エラーがあったときに「ひと言メッセージ」の入力欄にすでに入力したテキストが入るように設定します。
以下の赤字のコードを追記してください。
index.php
---- 省略 ----
<form method="post">
<div>
<label for="view_name">表示名</label>
<input id="view_name" type="text" name="view_name" value="<?php if( !empty($_SESSION['view_name']) ){ echo htmlspecialchars( $_SESSION['view_name'], ENT_QUOTES, 'UTF-8'); } ?>">
</div>
<div>
<label for="message">ひと言メッセージ</label>
<textarea id="message" name="message"><?php if( !empty($message) ){ echo htmlspecialchars( $message, ENT_QUOTES, 'UTF-8'); } ?></textarea>
</div>
<input type="submit" name="btn_submit" value="書き込む">
</form>
---- 省略 ----ここまでの編集内容を保存して、ブラウザでひと言メッセージの投稿を試してみてください。
編集ページも最大文字数のバリデーションを実装
ひと言メッセージは「index.php」での新しい投稿の他に、管理者用の編集ページ「edit.php」からも投稿（編集）することができるようになっています。
そこで、編集ページも同じように最大文字数のバリデーションを設定していきます。
「edit.php」を開いて、先ほどと同じようにメッセージの入力チェックのif文にelse文を追記する形で、赤字のコードを追記してください。
edit.php
<?php
---- 省略 ----
} elseif( !empty($_POST['message_id']) ) {
// 空白除去
$view_name = preg_replace( '/\A[\p{C}\p{Z}]++|[\p{C}\p{Z}]++\z/u', '', $_POST['view_name']);
$message = preg_replace( '/\A[\p{C}\p{Z}]++|[\p{C}\p{Z}]++\z/u', '', $_POST['message']);
// 表示名の入力チェック
if( empty($view_name) ) {
$error_message[] = '表示名を入力してください。';
}
// メッセージの入力チェック
if( empty($message) ) {
$error_message[] = 'メッセージを入力してください。';
} else {
// 文字数を確認
if( 100 < mb_strlen($message, 'UTF-8') ) {
$error_message[] = 'ひと言メッセージは100文字以内で入力してください。';
}
}
if( empty($error_message) ) {
// トランザクション開始
$pdo->beginTransaction();
---- 省略 ----許容する最大文字数はここでも同じ「100文字」に設定しています。
ここまでの編集内容を保存して、こちらのページでも管理者としてログインして動作を確認してみてください。
以上で今回の内容は完了です。
今回まで作成してきた「ひと言掲示板」について、一通りの機能を実装してきました。
当ワークショップはここまでとなります。
ワークショップへのフィードバックやご要望はいつでも大歓迎です。
記事の下部にある「こちらの記事は役に立ちましたか？」のボタンを押すと表示されるメッセージ欄か、お問い合わせページよりお気軽にお送りください。
いつでもお待ちしております。
今回作成したコード：Github