webページのつくり方 | 学びの道

webページのつくり方、web制作、web作成、学びの道を歩み中!フェリカテクニカルアカデミー「東京・池袋」にてWeb作成を勉強中です。学んだ事をメモしていきます。

PHP 送信データを受け取る 【radio】

PHP 送信データを送るinput(入力画面) → 受け取るoutput(吐き出し画面)を作成しよう。【radio】

                                      

復習

  • f:id:kaoru01-05:20140522132353p:plain 送信ボタン input type="submit" value="送信"

                                      

input(入力画面)

f:id:kaoru01-05:20140522131619p:plain

    ↓

output(出力画面)

f:id:kaoru01-05:20140522131730p:plain

                                      

input(入力画面)

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ラジオボタン</title>
</head>
<body>
<form name="input_radio" action="output_radio.php" method="post">
<table>
<tr>
<th>性別</th>
<td>
<input type="radio" name="gender"  value="男性">男性<br>
<input type="radio" name="gender"  value="女性">女性<br>
<input type="radio" name="gender"  value="解答しない">解答しない
</td>
</tr>
</table>
<input type="submit" value="送信">
</form>
</body>
</html>

                                              
output(出力画面)

<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="../input 0522/style.css">
<title>レディオボックス</title>
</head>

<body>
<h1>ご協力ありがとうございました</h1>
<p>あなたの回答は
<?php
print htmlspecialchars($_POST['gender'],ENT_QUOTES);
?>
ですね。</p>
</body>

                                      

css

table {
  border-collapse:collapse;
  border-spacing:0;
  border:#93c400 1px solid;
  width:420px;
}
th,td {
  border:#93c400 1px solid;
  padding:10px 10px;
}
.btn{
  cursor: pointer;
}
.btn:hover {
   color:#666;
background:#FFF;
}