お問い合せフォーム - テスト解答例

《index.html》

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせ入力フォーム</title>
<link href="style.css" rel="stylesheet" media="all">
</head>
<body>
<div id="confirmation">
<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"></td>
</tr>
<tr>
<th><label for="email">メールアドレス</label></th>
<td><input type="text" name="email" size="30" id="email"></td>
</tr>
<tr>
<th><label for="message">ご意見</label></th>
<td><textarea name="message" cols="30" rows="5" id="message"></textarea></td>
</tr>
</table>
<input type="submit" value="確認画面へ">
</form>
</div>
</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; /* ボックスの幅を指定 */
  margin: 100px 0 0 100px;
}
#confirmation {
  width: 600px; /* 確認画面の幅を指定 */
  margin: 100px 0 0 100px;
  padding: 0.5em 1em;
  border-left: #C21300 6px solid;
}
#inquiry th {
  text-align: right;
}
#confirmation ul {
  list-style: none;
  margin: 0 0 2em 0;
  padding: 0;
}
#confirmation form {
  margin: 0;
  padding: 0;
}

入力したデータを確認する画面を作成しなさい

《check.php》

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>確認画面</title>
<link href="style.css" rel="stylesheet" media="all">
</head>
<body>
<div id="confirmation">
<?php
 $name = $_POST['name'];
 $email = $_POST['email'];
 $message = $_POST['message'];
	
 $name = htmlspecialchars($name);
 $email = htmlspecialchars($email);
 $message = htmlspecialchars($message);

  print '<ul>'. "\n";
  print '<li>';
    if($name=='') {
        print 'お名前が、入力されていません。';
    } else {
        print 'ようこそ、'.$name.'様';
    }
  print '</li>'. "\n";
  print '<li>';
    if($email=='') {
        print 'メールアドレスが、入力されていません。';
    } else {
        print 'メールアドレス：'.$email;
    }
  print '</li>'. "\n";
  print '<li>';		
    if($message=='') {
        print 'お問い合わせの内容が、入力されていません。';
    } else {
        print 'お問い合わせの内容：'.$message;
    }
  print '</li>'. "\n";
  print '</ul>'. "\n";

if($name=='' || $email=='' || $message=='') {
  print '<form>'. "\n";
  print '<input type="button" onclick="history.back()" value="戻る">'. "\n";;
  print '</form>'. "\n";	
} else {
  print '<form action="thanks.php" method="post">'. "\n";
  print '<input type="hidden" name="name" value="'.$name.'">';
  print '<input type="hidden" name="email" value="'.$email.'">';
  print '<input type="hidden" name="message" value="'.$message.'">';
  print '<input type="button" onclick="history.back()" value="戻る">'. "\n";
  print '<input type="submit" value="送信">'. "\n";
  print '</form>'. "\n";
}
?>
</div>
</body>
</html>

送信後に登録者に送信内容を確認する画面を作成しなさい

《thanks.php》

以下の例は、「SQLの接続と終了」の書き方は、テキストとは別の方法にしてあります

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>確認画面</title>
<link href="style.css" rel="stylesheet" media="all">
</head>
<body>
<div id="confirmation">
<?php
 $dsn = 'mysql:dbname=データベース名;host=ホスト名';
 $user = 'ログイン名';
 $password = 'パスワード';
 $dbh = new PDO($dsn, $user, $password);
 $dbh -> query('SET NAMES UTF-8');

 $name = $_POST['name'];
 $email = $_POST['email'];
 $message = $_POST['message'];

 $name = htmlspecialchars($name);
 $email = htmlspecialchars($email);
 $message = htmlspecialchars($message);

  print $name.'様<br>'. "\n";
  print 'お問い合わせ、ありがとうございました。<br>'. "\n";
  print 'お問い合わせ内容『'.$message.'』を<br>'. "\n";
  print $email.'にメールで送りましたのでご確認ください。'. "\n";

 $mail_sub = 'お問い合わせを受け付けました。';
 $mail_body = $name."様、ご協力ありがとうございました。";
 $mail_body = html_entity_decode($mail_body,ENT_QUOTES,"UTF-8");
 $mail_head = 'From:メールアドレス';
 mb_language('Japanese');
 mb_internal_encoding("UTF-8");
 mb_send_mail($email,$mail_sub,$mail_body,$mail_head);

 $sql = 'INSERT INTO inquiry(name, email, message) VALUES("'.$name.'","'.$email.'","'.$message.'")';
 $stmt = $dbh -> prepare($sql);
 $stmt -> execute();

 $dbh = null;
?>
</div>
</body>
</html>

データベースからの取得

お問い合せ内容一覧画面を作成しなさい
お問い合せ内容検索画面を作成しなさい
「一覧」と「検索」を含む管理画面を作りなさい