HTMLで入力フォーム作成してデータ送信【会員登録フォーム実装２】
Webシステムでよくある「会員登録フォーム」のような入力フォームを作成する方法を解説します。
今回はPOST送信された会員登録フォームに入力された値をPHPで値チェックするサンプルを解説します。
前回は会員登録フォームのHTMLを作成して解説をしました。
関連記事：HTMLで入力フォーム作成してデータ送信【会員登録フォーム実装１】
POST送信された入力フォームの値をチェックするサンプルコードを解説
POST送信された入力フォームの値をチェックするサンプルコードの解説を行います。
サンプルコード
PHPとHTMLのサンプルコードです。
<?php
$errors = $data = [];
do {
// POSTデータを取得
$data = $_POST;
if (!$data) {
// フォームの初期値
$data = [
'name' => '', 'mail' => '', 'password' => '', 'sex' => '', 'questions' => [], 'birth' => ''
];
break;
}
// 名前の入力値
$name = trim(@$data['name']);
if (!$name) {
$errors['name'] = '名前が入力されていません。';
}
else if (mb_strlen($name) < 3) {
$errors['name'] = '名前は３文字以上入力してください。';
}
else if (mb_strlen($name) > 10) {
$errors['name'] = '名前は１０文字以内で入力してください。';
}
$data['name'] = $name;
// メールアドレスの入力値
$mail = trim(@$data['mail']);
if (!$mail) {
$errors['mail'] = 'メールアドレスが入力されていません。';
}
$data['mail'] = $mail;
// パスワードの入力値
$password = trim(@$data['password']);
if (!$password) {
$errors['password'] = 'パスワードが入力されていません。';
}
else if (preg_match("/^[a-zA-Z0-9]+$/", $password)) {
$errors['password'] = 'パスワードは半角英数で入力してください。';
}
else if (mb_strlen($password) < 3) {
$errors['name'] = '名前は８文字以上入力してください。';
}
else if (mb_strlen($name) > 15) {
$errors['name'] = '名前は１５文字以内で入力してください。';
}
$data['password'] = $password;
// 性別の入力値
$sex = trim(@$data['sex']);
if (!$sex) {
$errors['sex'] = '性別が選択されていません。';
}
else if ($sex != 'man' && $sex != 'woman') {
$errors['sex'] = '性別が正しく選択されていません。';
}
$data['sex'] = $sex;
// 質問の入力値
$questions = @$data['questions'];
if (!$questions) {
$data['questions'] = [];
$errors['questions'] = '質問が１つ以上選択されていません。';
}
else if (!is_array($questions)) {
$data['questions'] = [];
$errors['questions'] = '質問が正しく選択されていません。';
}
else {
foreach ($questions as $index=>$question) {
$q = trim($question);
if ($q != 'html' && $q != 'css' && $q != 'php') {
$errors['questions'] = '質問が正しく選択されていません。';
}
$data['questions'][$index] = $q;
}
}
// 誕生月の入力値
$birth = trim(@$data['birth']);
if (!$birth) {
$errors['birth'] = '誕生月が選択されていません。';
}
else if (!is_numeric($birth)) {
$errors['birth'] = '誕生月が正しく選択されていません。';
}
else if ($birth <= 0 || $birth > 12) {
$errors['birth'] = '誕生月は１～１２で選択されていません。';
}
$data['birth'] = $birth;
// 画像ファイルの入力値
$file = $_FILES;
$image = @$data['image'];
if (!$image) {
$errors['image'] = '画像ファイルが選択されていません。';
}
} while(0);
?>
<html>
<head>
<title>入力フォームデータをサーバへ送信サンプル(1)</title>
<meta charset="utf-8">
<style>
.error {
color: #ff0000;
}
</style>
</head>
<body>
<h1>入力フォームデータをサーバへ送信サンプル(1)</h1>
<form method="post" action="/sample/html/form.php" enctype="multipart/form-data">
<div>
<label for="name">名前：</label>
<input type="text" id="name" name="name" value="<?php echo $data['name'] ?>">
<?php if (isset($errors['name']) && $errors['name']) : ?>
<div><span class="error"><?php echo $errors['name'] ?></span></div>
<?php endif; ?>
</div>
<div>
<label for="mail">メールアドレス：</label>
<input type="email" id="mail" name="mail" value="<?php echo $data['mail'] ?>">
<div><span class="error"><?php echo $errors['mail'] ?></span></div>
</div>
<div>
<label for="password">パスワード：</label>
<input type="password" id="password" name="password" value="<?php echo $data['password'] ?>">
<div><span class="error"><?php echo $errors['password'] ?></span></div>
</div>
<div>
<label for="sex" ><input type="radio" id="sex" name="sex" value="sex" <?php echo ($data['sex'] == 'sex' ) ? ' checked="true"': '' ?>>性別</label>
<label for="man" ><input type="radio" id="man" name="sex" value="man" <?php echo ($data['sex'] == 'man' ) ? ' checked="true"': '' ?>>男</label>
<label for="woman"><input type="radio" id="woman" name="sex" value="woman" <?php echo ($data['sex'] == 'woman') ? ' checked="true"': '' ?>>女</label>
<div><span class="error"><?php echo $errors['sex'] ?></span></div>
</div>
<div>
<span>興味があるのはどれですか？</span>
<label for="questions"><input type="checkbox" id="questions" name="questions[]" value="question" <?php echo (in_array('question',$data['questions'])) ? ' checked="true"': '' ?>>質問</label>
<label for="html" ><input type="checkbox" id="html" name="questions[]" value="html" <?php echo (in_array('html', $data['questions'])) ? ' checked="true"': '' ?>>HTML</label>
<label for="css" ><input type="checkbox" id="css" name="questions[]" value="css" <?php echo (in_array('css', $data['questions'])) ? ' checked="true"': '' ?>>CSS</label>
<label for="php" ><input type="checkbox" id="php" name="questions[]" value="php" <?php echo (in_array('php', $data['questions'])) ? ' checked="true"': '' ?>>PHP</label>
<div><span class="error"><?php echo $errors['questions'] ?></span></div>
</div>
<div>
<label for="birth">誕生月：</label>
<select id="birth" name="birth">
<option value="birth" <?php echo ($data['birth'] == 'birth') ? ' selected="true"': '' ?>>誕生月</option>
<option value="1" <?php echo ($data['birth'] == '1' ) ? ' selected="true"': '' ?>> 1月</option>
<option value="2" <?php echo ($data['birth'] == '2' ) ? ' selected="true"': '' ?>> 2月</option>
<option value="3" <?php echo ($data['birth'] == '3' ) ? ' selected="true"': '' ?>> 3月</option>
<option value="4" <?php echo ($data['birth'] == '4' ) ? ' selected="true"': '' ?>> 4月</option>
<option value="5" <?php echo ($data['birth'] == '5' ) ? ' selected="true"': '' ?>> 5月</option>
<option value="6" <?php echo ($data['birth'] == '6' ) ? ' selected="true"': '' ?>> 6月</option>
<option value="7" <?php echo ($data['birth'] == '7' ) ? ' selected="true"': '' ?>> 7月</option>
<option value="8" <?php echo ($data['birth'] == '8' ) ? ' selected="true"': '' ?>> 8月</option>
<option value="9" <?php echo ($data['birth'] == '9' ) ? ' selected="true"': '' ?>> 9月</option>
<option value="10" <?php echo ($data['birth'] == '10' ) ? ' selected="true"': '' ?>>10月</option>
<option value="11" <?php echo ($data['birth'] == '11' ) ? ' selected="true"': '' ?>>11月</option>
<option value="12" <?php echo ($data['birth'] == '12' ) ? ' selected="true"': '' ?>>12月</option>
</select>
<div><span class="error"><?php echo $errors['birth'] ?></span></div>
</div>
<div>
<label for="image">画像：</label>
<input type="file" id="image" name="image">
<div><span class="error"><?php echo $errors['image'] ?></span></div>
</div>
<div>
<button type="submit">データを送信する</button>
</div>
</form>
</body>
</html>会員登録フォームのHTML解説は、HTMLで入力フォーム作成してデータ送信【会員登録フォーム実装１】で解説しています。
PHPの解説
PHPのサンプルコード解説です。
do-while文で囲む
do-while文で処理を囲みます。そしてPOST送信されなかったときに break でdo-while文で囲んだ処理を抜け出しています。
do {
・・・
break;
} while(0);do-while文で囲んでいる理由
do-while文で囲んだ中で break すると処理を抜け出して条件分岐などによる階層が深くならないようにしています。そうすることで読みやすいプログラムとなるようにしています。
POSTデータを取得
POST送信されてくる各フォームに入力された値は $_POST に格納されているので取得します。
$data = $_POST;初期表示用の処理
もし $_POST に値がなかった場合は、初期表示用の処理をします。そして break で do-while文を抜け出します。
if (!$data) {
// フォームの初期値
$data = [
'name' => '', 'mail' => '', 'password' => '', 'sex' => '', 'questions' => [], 'birth' => ''
];
break;
}名前の入力値をチェック
名前に入力された値をチェックします。
まずは値を取得します。
$name = trim(@$data['name']);ちょっと特殊な @ とか trim について詳しく説明します。
変数前にある＠（アットマーク）について
最初に＠（アットマーク）を付けることでエラーが表示されなくなります。これをエラー制御演算子といいます。
例えば $data['name’] がないときは通常はエラーが表示されます。でも変数の最初に＠を付けるとエラーが表示されなくなります。
＞＞なぜココで＠を利用しているのか
理由は条件分岐を減らしてプログラムを読みやすくするためです。本当であれば isset($data['name’]) などの条件分岐が必要ですが、＠を使う事で条件分岐を減らしています。
trim（トリム）について
trimで変数にセットされた値の先頭と末尾の空白（スペース）を消しています。例えば $data['name’] に" abcd “がセットされている場合、値を"abcd"としてくれます。
＞＞なぜtrimするのか
入力フォームの前後にある空白は入力ミスであることが大半です。なのでtrimで削除するようにプログラムすることが多いです。
次に入力された値をいくつかの条件でチェックします。（※チェックする条件はシステムによります。）
if (!$name) {
$errors['name'] = '名前が入力されていません。';
}
else if (mb_strlen($name) < 3) {
$errors['name'] = '名前は３文字以上入力してください。';
}
else if (mb_strlen($name) > 10) {
$errors['name'] = '名前は１０文字以内で入力してください。';
}最後に値を $data 配列へ格納します。
(trimで前後の空白を削除しているので値を上書き更新しています。)
$data['name'] = $name;メールアドレスの入力値をチェック
メールアドレスに入力された値をチェックします。
$mail = trim(@$data['mail']);
if (!$mail) {
$errors['mail'] = 'メールアドレスが入力されていません。';
}
$data['mail'] = $mail;メールアドレスの形式チェックは正規表現で行いますが、今回は割愛しています🙇
パスワードの入力値をチェック
パスワードに入力された値をチェックします。
$password = trim(@$data['password']);
if (!$password) {
$errors['password'] = 'パスワードが入力されていません。';
}
else if (preg_match("/^[a-zA-Z0-9]+$/", $password)) {
$errors['password'] = 'パスワードは半角英数で入力してください。';
}
else if (mb_strlen($password) < 3) {
$errors['name'] = '名前は８文字以上入力してください。';
}
else if (mb_strlen($name) > 15) {
$errors['name'] = '名前は１５文字以内で入力してください。';
}
$data['password'] = $password;複雑な preg_match(“/^[a-zA-Z0-9]+$/", $password) は、正規表現を使った条件式です。
正規表現とは
文字列の値を指定のパターンで表す記法です。ここでは「a-z → a～z」「A-Z → A～Z」「0-9 → 0～９」の値であることを表しています。
性別の入力値をチェック
性別の値をチェックします。
$sex = trim(@$data['sex']);
if (!$sex) {
$errors['sex'] = '性別が選択されていません。';
}
else if ($sex != 'man' && $sex != 'woman') {
$errors['sex'] = '性別が正しく選択されていません。';
}
$data['sex'] = $sex;ラジオボタンのように選択する入力フォームも必ず値のチェックを行いましょう！これを怠るとハッキング / クラッキングされる大変危険なセキュリティホールとなります。
質問の入力値をチェック
質問の値をチェックします。
$questions = @$data['questions'];
if (!$questions) {
$data['questions'] = [];
$errors['questions'] = '質問が１つ以上選択されていません。';
}
else if (!is_array($questions)) {
$data['questions'] = [];
$errors['questions'] = '質問が正しく選択されていません。';
}
else {
$data['questions'] = [];
foreach ($questions as $index=>$question) {
$q = trim($question);
if ($q != 'html' && $q != 'css' && $q != 'php') {
$errors['questions'] = '質問が正しく選択されていません。';
}
$data['questions'][$index] = $q;
}
}質問は複数選択できるので $questions には複数の値がセットされます。そのため foreach でループしながら値のチェックを行っています。
誕生月の入力値をチェック
誕生月の値をチェックします。
$birth = trim(@$data['birth']);
if (!$birth) {
$errors['birth'] = '誕生月が選択されていません。';
}
else if (!is_numeric($birth)) {
$errors['birth'] = '誕生月が正しく選択されていません。';
}
else if ($birth <= 0 || $birth > 12) {
$errors['birth'] = '誕生月は１～１２で選択されていません。';
}
$data['birth'] = $birth;画像ファイルの入力値をチェック
画像ファイルが選択されているかチェックします。
$file = $_FILES;
$image = @$data['image'];
if (!$image) {
$errors['image'] = '画像ファイルが選択されていません。';
}まとめ
今回は会員登録フォームに入力された値をPOST送信でPHPで取得して値を入力チェックする処理について解説しました。
会員登録フォームのHTML作成やPOST送信form作成は、システム開発で頻繁に実装します。
ユート
1985年生まれ1児の父親です。Web系エンジニアを10年以上しています。
→プロフィール
→Amazon欲しいものリスト