・注文フォームの要件
ファイル名(フォーム): htdocs/14/order_form.php ファイル名(確認画面): htdocs/14/order_confirm.php
1・注文者名、注文者住所、注文者電話番号の入力欄をtype="text"で配置
2・注文する商品のラジオボタンを配置
3・「紙の領収書を希望する」チェックボックスを配置
4・「注文内容を送信」と書かれたsubmitボタンを配置
order_form.php
<!DOCTYPE html>
<html lang="ja">
<head>
<title>order_form</title>
<style>
label {
display:block;
}
</style>
<script src="jquery-3.6.0.min.js"></script>
<script>
var nowVal;
function fnc(obj){
if(nowVal == obj.value){
obj.checked = false;
nowVal = "";
}else{
nowVal = obj.value;
}
}
</script>
</head>
<body>
<h1>注文フォーム</h1>
<form action="order_confirm.php" method="get">
<label>注文者名: <input type="text" name="radio1"></label>
<label>注文者住所: <input type="text" name="radio2"></label>
<label>注文者電話番号: <input type="text" name="radio3"></label>
<h2>購入を希望する商品</h2>
<label>単品: <input type="radio" name="radio4" value="単品"></label>
<label>3個入り: <input type="radio" name="radio4" value="3個入り"></label>
<label>10個入り: <input type="radio" name="radio4" value="10個入り"></label>
<h2><label>紙の領収書を希望する:
<input type="radio" name="radio" onclick="fnc(this);"></label></h2>
<input type="submit" value="注文内容を送信">
</form>
</body>
</html>
order_confirm.php
<?php
$errors = [];
if($_GET['radio1'] !== "") {
$radio1 = $_GET['radio1'];
}else{
echo $_GET['radio1'];
$radio1 = "";
$errors[] = '注文者名を入力してください';
}
if($_GET['radio2'] !== "") {
$radio2 = $_GET['radio2'];
}else{
$radio2 = "";
$errors[] = '注文者住所を入力してください';
}
if($_GET['radio3'] !== "") {
$radio3 = $_GET['radio3'];
}else{
$radio3 = "";
$errors[] = '注文者電話番号を入力してください';
}
if(isset($_GET['radio4']) === true){
$radio4 = $_GET['radio4'];
}else{
$radio4 = "";
$errors[] = '商品名を選択しください';
}
if(isset($_GET['radio']) === true){
$radio = "領収書:要";
}else{
$radio = "領収書不要";
}
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<title>order_confirm</title>
<style>
a {
text-decoration: none;
color: black;
}
button {
display:block;
margin-bottom: 10px;
}
.error {
color: red;
}
.error1 {
font-weight: bold;
}
</style>
</head>
<body>
<!-- エラーがあれば表示 -->
<h1>注文確認画面</h1>
<?php
foreach($errors as $error){ ?>
<p class="error" > <?php echo $error; ?> <p>
<?php }
?>
<dl>
<dt>注文者名</dt>
<dd><?=$radio1?></dd>
<dt>注文者住所</dt>
<dd><?=$radio2?></dd>
<dt>注文者電話番号</dt>
<dd><?=$radio3?></dd>
<dt>商品名</dt>
<dd><?=$radio4?></dd>
<dt>領収書</dt>
<dd class="error1" ><?= $radio?></dd>
</dl>
<button type="button"><a href="order_form.php">注文を確定</a></button>
<!-- <button type="button"><a href="order_form.php">戻る</a></button> -->
<button onclick="location.href='./order_form.php'">戻る</button>
</html>