PHPとMySQLでECサイトをフルスクラッチ開発⑦商品一覧、ページ遷移先指定画面の作成
2021-07-21
今回は、データベースを参照し、登録商品の一覧表示させる画面と、そこから修正、追加、詳細、削除、などのページへ値を渡しつつページ移動するページ遷移先指定画面を作成します。
星マークのページは前回までで作成済みになります。今回は雲マークのpro_list.php pro_branch.php pro_ng.php を作成します。
※あらかじめ、pro_add.phpにアクセスして各カテゴリ別で２つずつ位商品を登録しておいてください。
商品一覧画面
pro_list.php
<?php
session_start();
session_regenerate_id(true);
if(isset($_SESSION["login"]) === false) {
print "ログインしていません。<br><br>";
print "<a href='staff_login.html'>
ログイン画面へ</a>";
exit();
} else {
print $_SESSION["name"]."さんログイン中";
print "<br><br>";
}
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
<title>商品一覧</title>
<link rel="stylesheet"
href="../style.css">
</head>
<body>
<?php
try{
$dsn = "mysql:host=localhost;
dbname=shop;charset=utf8";
$user = "root";
$password = "";
$dbh = new PDO($dsn, $user, $password);
$dbh -> setAttribute
(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT code,name,price
FROM mst_product WHERE1";
$stmt = $dbh -> prepare($sql);
$stmt -> execute();
$dbh = null;
print "商品一覧<br><br>";
print "<form action=
'product_branch.php' method='post'>";
while(true) {
$rec = $stmt -> fetch(PDO::FETCH_ASSOC);
if($rec === false) {
break;
}
print "<input type='radio'
name='code' value='".$rec['code']."'>";
print $rec["name"];
print "---";
print $rec["price"]."円";
print "<br>";
}
print "<br>";
print "<input type='submit'
name='disp' value='詳細'>";
print "<input type='submit'
name='add' value='追加'>";
print "<input type='submit'
name='edit' value='修正'>";
print "<input type='submit'
name='delete' value='削除'>";
}
catch(Exception $e) {
print "只今障害が発生しております。
<br><br>";
print "<a href='../staff_login/
staff_login.html'>ログイン画面へ</a>";
}
?>
<br><br>
<a href="../staff_login/
staff_login_top.php">管理画面TOPへ</a>
</body>
</html>
このページのプログラムが走れば下図のような表示になります。
以前作成したスタッフ一覧画面（staff_list.php）とほとんど同じ内容ですね。プログラムもほぼ同じです。
productフォルダ内にpro_list.phpを作成します。
このページでは、データベースに登録されている全ての商品を一覧表示させたいので、まずデータベースに接続をします。
SQLのSELECT文でmst_productテーブルからcode,name,price,を選択しています。レコードはWHERE1ですので、全てのレコードが対象になります。
$sql = “SELECT code,name FROM mst_staff WHERE1”; は、SELECT文です。WHERE1は全てのレコードを指定する事になるので、この場合は「mst_staffテーブルのすべてのレコードのcodeとnameカラムを選択」になります。
SQLを実行した後、データベースを閉じます。
この後、商品を一覧表示させるループ文に入るので、その前にhtmlのformタグを作成しておきます。
print “<form… 飛び先はpro_branch.php でpost送信。
ここから、画面にスタッフ全員を一覧表示させるプログラムに入ります。
while(true){}は、永久ループになります。
$rec = $stmt -> fetch(PDO::FETCH_ASSOC); は、SQLで取り出した全レコードの情報を、プライマリkeyの昇順に１つずつ抜き出し、$recに格納しています。
if($rec === false) { break; } は、つまり全てのレコードを取り出したあと、$recは空の値となるので、その場合はbreak;でループから抜け出すといったプログラムです。
したがって、$recに値がある（レコードの情報がある）場合、商品情報を表示させるプログラムが繰り返されます。
表示された商品を選択出来るようにするため、ラジオボタンを付けています。
input type=”radio”(ラジオボタン) name=”code”(sumitで渡す値の名前) value=”.$rec[‘code’].”(submitで渡す値) になります。したがって、今回のラジオボタンは、商品codeをpost送信するために付けています。
$rec[“name”]で商品名が表示されるので、ラジオボタンの隣にスタッフ名が表示される形になります。
$rec["price"]で商品価格が表示されるので、商品名の隣に商品価格が表示される形になります。
<br>で改行なので、ループすれば上図のような表示になります。
ループから抜け出した後、今後作成するスタッフ編集画面に飛ぶための４つのsubmitボタンを作成します。（詳細、追加、修正、削除）
submitにnameを付けていますが、これはページ移動後、押されたsubmitボタンの識別を付けるためです。
最後に、管理トップ画面のリンクを貼っておきます。
ページ遷移先指定画面
pro_branch.php
<?php
session_start();
session_regenerate_id(true);
if(isset($_SESSION["login"]) === false) {
print "ログインしていません。<br><br>";
print "<a href='staff_login.html'>
ログイン画面へ</a>";
exit();
}
if(isset($_POST["add"]) === true) {
header("Location:product_add.php");
exit();
}
if(isset($_POST["disp"]) === true) {
if(isset($_POST["code"]) === false) {
header("Location:product_ng.php");
exit();
}
$code = $_POST["code"];
header("Location:product_disp.php?
code=".$code);
exit();
}
if(isset($_POST["edit"]) === true) {
if(isset($_POST["code"]) === false) {
header("Location:product_ng.php");
exit();
}
$code = $_POST["code"];
header("Location:product_edit.php?
code=".$code);
exit();
}
if(isset($_POST["delete"]) === true) {
if(isset($_POST["code"]) === false) {
header("Location:product_ng.php");
exit();
}
$code = $_POST["code"];
header("Location:product_delete.php?
code=".$code);
exit();
}
?>
productフォルダ内にpro_branch.phpを作成します。
こちらのプログラムも、以前作成したstaff_branch.phpとほぼ同じ内容です。
このページは、リスト画面から４つのsubmitボタンのいずれかが押された際、指定作のページへ自動的に飛ぶようにプログラムされています。header(“location..があるので、htmlは記述せず、画面にはなにも表示されません。
※headerの命令文は、htmlの配下に記述出来ない仕様となっています。
一つ抜粋して説明すると、例えば商品修正のボタンを押したならば、isset($_POST[“edit”]) === true になるので、ここのif文のプログラムが実行されます。
続く if(isset($_POST[“code”]) === false) は、これはラジオボタンが押されたかどうかの確認になります。したがって、falseならスタッフが選択されていないので強制的にheaderでpro_ng.phpのページへ飛ばします。
ラジオボタンが押されていれば、$code = $_POST[“code”]; でスタッフコードを$codeに代入します。
その後、headerでstaff_edit.phpに飛ばしますが、ここがポイントで、urlの後に「?code=”.$code」と続いています。
これは、「get送信」しているのです。
このページでは、目に見えるボタンを装飾出来ないので、post送信ができません。（$_SESSION[]で賄うこともできそうですが、、)しかし、urlに値を乗せる「ＧＥＴ送信」なら可能になります。
したがって、スタッフ情報の核となるスタッフコードを、headeのurlに乗っけてしまえばいいんですね。
パスワードなどの情報であれば、目に見えてしまうurlに乗せるget送信はいけませんが、スタッフコードであれば特段問題ないので、見えても良いような情報の場合、get送信も使います。
記述は、pro_edit.php?code=”.$code のように、飛び先のURLの？の後がGETの値になります。
code=は名前で、そこに.$code で値をつなげば、後のページで$_GET[“code”]で商品コードが受け取れます。
商品選択ＮＧ画面
pro_ng.php
<?php
session_start();
session_regenerate_id(true);
if(isset($_SESSION["login"]) === false) {
print "ログインしていません。<br><br>";
print "<a href='staff_login.html'>
ログイン画面へ</a>";
exit();
} else {
print $_SESSION["name"]."さんログイン中";
print "<br><br>";
}
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
<title>商品選択NG</title>
<link rel="stylesheet"
href="../style.css">
</head>
<body>
商品を選択して下さい<br><br>
<a href="product_list.php">商品一覧へ</a>
</body>
</html>
productフォルダ内にpro_ng.phpを作成します。
商品リスト画面で、ラジオボタンにチェックなくsubmitボタンを押したときに表示される画面です。
商品が選択されていないので、その旨を伝えるだけのページですね。とくに説明はありません。
こちらもstaff_ng.phpと同じです。
ここまで作成できれば、ログイン後の商品管理トップページから商品追加画面へ飛べるようになるので、pro_add..のページのコメントアウトしておいたsessionの記述部分を解除しておいてください。
次回は商品の修正ページを作成します。