お問い合わせフォーム(2) - Web関連あれこれ

▼完成URL
http://jewelcafe.main.jp/0822/toi04/index.php

入力画面

index.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
<link rel="stylesheet" href="style.css" media="screen, print">
</head>
<body>
 <form action="check.php" method="post" id="inquiry">
  <table summary="お問い合わせに関する入力項目名とその入力欄">
  <tr>
  <th><label for="name">お名前</label></th>
  <td><input type="text" name="name" size="30" id="name" class="text1"></td>
  </tr>
  <tr>
  <th><label for="email">メールアドレス</label></th>
  <td><input type="text" name="email" size="30" id="email" class="text2"></td>
  </tr>
  <tr>
  <th><label for="message">お問い合わせ内容</label></th>
  <td><textarea name="message" cols="30" rows="5" class="text3" id="message"></textarea></td>
  </tr>
  </table>
  <input type="submit" value="確認画面へ">
  </form>
</body>
</html>

style.css

@charset "UTF-8";

body {
	font-size: 1.0em;
	font-family: sans-serif;
	line-height: 1.5;
	color: #333333;
	background-color: #FFFFFF;
}
#inquiry {
	width: 600px; /* ボックスの幅を指定 */
	padding: 2px 0 2px 20px;
	border-left: 5px #C30 solid;
}
th {
	text-align: right;
}
.text01 {
	font-weight: bold;
	color: #F00;	
}

↓入力しない部分があると、

↓メッセージと戻るボタンが表示される。

確認画面

メモ

htmlspecialchars→<h1>などのタグを文字列として表示させる。

いたずらから守る（サニタイジング）

check.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>確認画面</title>
<link rel="stylesheet" href="style.css" media="screen, print">
</head>
<body>
	<?php 
	$name = $_POST['name'];
	$email = $_POST['email'];
	$message = $_POST['message'];
	
	$name = htmlspecialchars($name);
	$email = htmlspecialchars($email);
	$message = htmlspecialchars($message);
	 
	echo'<ul>'."\n";
	echo'<li>';
	if($name=='') {
		echo '<span class="text01">お名前が入力されていません。</span>';
	}else{
		echo'ようこそ、'.$name.'様';
	}
	echo'</li>'."\n";
	echo'<li>';
	if($email=='') {
		echo'<span class="text01">メールアドレスが、入力されていません。</span>';
	} else {
		echo'メールアドレス: '.$email;
	} 
	echo'</li>'."\n";
	echo'<li>';
	if($message=='') {
		echo'<span class="text01">お問い合わせの内容が、入力されていません。</span>';
	} else {
		echo 'お問い合わせの内容: '.$message;
	}
	echo'</li>'."\n";
	echo'</ul>'."\n";
	
	if($name=='' || $email=='' || $message=='') {
	echo'<form>'."\n";
	echo'<input type="button" onClick="history.back()" value="戻る">'."\n";
	echo'</form>'."\n";
	} else {
	echo'<form action="thanks.php" method="post">'."\n";
	echo'<input type="hidden" name="name" value="'.$name.'">';
	echo'<input type="hidden" name="email" value="'.$email.'">';
	echo'<input type="hidden" name="message" value
	="'.$message.'">';
	echo'<input type="button" onClick="history.back()" value="戻る">'."\n";
	echo'<input type="submit" value="送信">'."\n";
	echo'</form>'."\n";
	}
	?>
</body>
</html>

サンクスメッセージ

thanks.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>確認画面</title>
<link rel="stylesheet" href="style.css" media="screen, print">
</head>
<body>
  <?php
	$name = $_POST['name'];
	$email = $_POST['email'];
	$message = $_POST['message'];
	
	$name = htmlspecialchars($name);
	$email = htmlspecialchars($email);
	$message = htmlspecialchars($message);
	
	echo $name.'様<br>'."\n";
	echo'お問い合わせ、ありがとうございました。<br>'."\n";
	echo 'お問い合わせ内容『'.$message.'』を<br>'."\n";
	echo $email.'にメールで送りましたのでご確認ください。'."\n";
	
	$mail_sub = 'お問い合わせを受け付けました。';
	$mail_body = $name."様、ご協力ありがとうございました。";
	$mail_body = html_entity_decode($mail_body,ENT_QUOTES,"UTF-8");
	$mail_head = 'From:xxx@gmail.com';
	
	mb_language('Japanese');
	mb_internal_encoding("UTF-8");
	mb_send_mail($email,$mail_sub,$mail_body,$mail_head);
	?>
</body>
</html>

↓入力したアドレスにメッセージが届く