PHP演習 7
PHPを使ったフォームの演習
SELECTを使ったFORMの演習をしました。
入力する前のフォームの画面
入力した後のフォームの画面
受信した内容を表示した画面
フォーム側(送信側)ソース
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>フォームの内容を取得する</title>
<style>
h1, p {
margin-left: 50px;
}
dl {
/* overflow: hidden; 入れると並びがずれる*/
margin: 50px;
}
dt {
float: left;
width: 150px;
}
dd {
margin-bottom: 20px;
}
</style>
</head>
<body>
<h1>フォームに入力した内容を取得する</h1>
<form action="output2.php" method="POST">
<dl>
<dt>お名前:</dt>
<dd><input type="text" name="name" placeholder="山川三平" required></dd>
<dt>生年月日(西暦):</dt>
<dd>
<select name="year">
<?php
for ( $i = 1945; $i <= 2000; $i++ ) {
echo "<option value='$i'>西暦{$i}年</option>";
}
/*valueなしの場合
for ( $i = 1945; $i <= 2000; $i++ ) {
echo "<option>{$i}</option>";
}*/
?>
</select>
<select name="month">
<?php
for ( $i = 1; $i <= 12; $i++ ) {
echo "<option value='$i'>{$i}月</option>";
}
?>
</select>
<select name="day">
<?php
for ( $i = 1; $i <= 31; $i++ ) {
echo "<option value='$i'>{$i}日</option>";
}
?>
</select>
</dd>
<dt>お住いの地域:</dt>
<dd>
<select name="home">
<option value="北海道">北海道</option>
<option value="東北">東北</option>
<option value="関東">関東</option>
<option value="中部">中部</option>
<option value="近畿">近畿</option>
<option value="中国・四国">中国・四国</option>
<option value="九州・沖縄">九州・沖縄</option>
<!--optionに限ってはvalueを省略すると
<option>と</option>の間の文字が使用される-->
</select>
</dd>
<dt>お使いのPC:</dt>
<dd>
<input type="radio" name="pc" id="win" value="Windows" checked><label for="win">Windows</label>
<input type="radio" name="pc" id="mac" value="Mac"><label for="mac">Mac</label>
</dd>
<dt>興味のある科目:</dt>
<dd>
<input type="checkbox" name="category" id="html" value="HTML"><label for="html">HTML</label>
<input type="checkbox" name="category" id="javascript" value="JavaScript"><label for="javascript">JavaScript</label>
<input type="checkbox" name="category" id="php" value="PHP"><label for="php">PHP</label>
<input type="checkbox" name="category" id="wordpress" value="wordpress"><label for="wordpress">wordpress</label>
</dd>
<dt>お問い合わせ内容:</dt>
<dd>
<textarea name="message" id="message" rows="5" cols="50"></textarea>
</dd>
</dl>
<p><input type="submit" value="送信する"></p>
</form>
</body>
</html>
受信した内容を表示するソース
<?php
$name = htmlspecialchars($_POST['name'],ENT_QUOTES,'UTF-8');
$year = $_POST['year'];
$month = $_POST['month'];
$day = $_POST['day'];
$home = $_POST['home'];
$pc = $_POST['pc'];
$message = htmlspecialchars($_POST['message'],ENT_QUOTES,'UTF-8');
//テキスト以外はhtmlspecialcharsは不要
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>無題ドキュメント</title>
<style>
h1 {
margin-left: 50px;
}
dl {
margin: 50px;
}
dt {
float: left;
width: 150px;
}
dd {
margin-bottom: 20px;
}
</style>
</head>
<body>
<h1>フォームに入力した内容を表示する</h1>
<dl>
<dt>お名前:</dt>
<dd><?php echo $name; ?></dd>
<dt>生年月日:</dt>
<dd><?php echo "{$year}年{$month}月{$day}日"; ?></dd>
<dt>お住いの地域:</dt>
<dd><?php echo $home;?></dd>
<dt>お使いのPC:</dt>
<dd><?php echo $pc;?></dd>
<dt>興味のある科目:</dt>
<dd>
<?php
foreach( $_POST['category'] as $value ){
echo "{$value} ";
}
?>
</dd>
<dt>お問い合わせ内容:</dt>
<dd><?php echo $message;?></dd>
</dl>
</body>
</html>