masimaro blog

menu

home > WEBアプリ開発:ECサイト > PHPとMySQLでECサイトをフルスクラッチ開発④スタッフ修正画面の作成

PHPとMySQLでECサイトをフルスクラッチ開発④スタッフ修正画面の作成


ECサイト
2021-07-21


今回はスタッフ情報の修正画面を作成します。

☆マークがついている部分がすでに完成したページになります。

今回は、雲マークのstaff_edit.php staff_edit_check.php staff_edit_done.php を作成したいと思います。

 

スタッフ情報修正入力画面

staff_edit.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{
    
$code = $_GET["code"];
    
$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 
FROM mst_staff WHERE code=?";
$stmt = $dbh -> prepare($sql);
$data[] = $code;
$stmt -> execute($data);
    
$dbh = null;
    
$rec = $stmt -> fetch(PDO::FETCH_ASSOC);
    
}
catch(Exception $e) {
    print "只今障害が発生しております。<br><br>";
    print "<a href='../staff_login/
staff_login.html'>ログイン画面へ</a>";
}
?>

スタッフコード<br>
<?php print $rec["code"];?>
 の情報を修正します。
<br><br>
<form action="staff_edit_check.php" 
method="post">
スタッフ名<br>
<input type="text" name="name" 
value="<?php print $rec['name'];?>">
<br><br>
パスワード<br>
<input type="pasword" name="pass">
<br><br>
パスワード再入力<br>
<input type="password" name="pass2">
<br><br>
<input type="hidden" name="code" 
value="<?php print $rec['code'];?>">
<input type="button" onclick=
"history.back()" value="戻る">
<input type="submit" value="OK">
</form>
</body>
</html>

staffフォルダ内にstaff_edit.phpを作成します。

このページは、staff_branch.phpより受け取ったスタッフコードをもとに、名前、パスワードの修正情報を入力する画面になります。

今までの応用になりますので、ポイントを絞って説明します。

まず、$_GET["code"] でstaff_branch.phpからget送信されたスタッフコードを受け取ります。このデータはテキスト入力されたものではないので、クロスサイトスクリプティングの対策は施しません。

続いて、スタッフ情報を表示させるためにデータベース接続します。

SQLのSELECT文で受け取ったスタッフコードをもとに、スタッフ情報を取り出します。今回はnameとcodeです。

後はスタッフコード〇番の修正のコメントを表示させて、staff_add.phpと同じようにformタグで名前はtext、パスワードはpasswordで入力欄を表示させます。

ここで、input type text にvalueで$rec["name"] を指定していますが、これでテキスト欄にあらかじめ現在のスタッフ名を表示させておく事が出来ます。

入力した内容がsabmitでstaff_edit_check.phpにpost送信されますが、スタッフコードがなければ修正にならないので、hiddenでスタッフコードを飛ばします。

修正入力チェック画面

staff_edit_check.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
    
require_once("../common/common.php");
    
$post = sanitize($_POST);
$code = $post["code"];
$name = $post["name"];
$pass = $post["pass"];
$pass2 = $post["pass2"];
    
print "スタッフコード<br>";
print $code;
print " の情報を修正します。";
print "<br><br>";
    
if(empty($name) === true) {
    print "名前が入力されていません。<br><br>";
} else {
    print "スタッフ名:";
    print $name;
    print "<br><br>";
}
    
if(empty($pass) === true) {
    print "パスワードが入力されていません。
           <br><br>";
}
    
if($pass != $pass2) {
    print "パスワードが異なります。<br><br>";
}
    
if(empty($name) or empty($pass) or 
$pass != $pass2) {
    print "<form>";
    print "<input type='button' 
onclick='history.back()' value='戻る'>";
    print "</form>";
} else {
    $pass = md5($pass);
    print "上記の通り修正しますか?<br><br>";
    print "<form action=
'staff_edit_done.php' method='post'>";
    print "<input type='hidden' name='name' 
value='".$name."'>";
    print "<input type='hidden' name='pass' 
value='".$pass."'>";
    print "<input type='hidden' name='code' 
value='".$code."'>";
    print "<input type='button' onclick=
'history.back()' value='戻る'>";
    print "<input type='submit' 
value='OK'>";
    print "</form>";
}
?>
</body>
</html>

staffフォルダ内にstaff_edit_check.phpを作成します。

こちらもstaff_add_check.phpとほぼ同じ内容になります。

入力された内容に、空白やpassの不一致があればそのコメントと前のページに戻るように誘導し、問題なければmd5でpasswordを暗号化し、修正しますか?のコメントを表示させてsubmitのボタンを表示させています。

OKボタンを押せば、hiddenでname,code,passの情報がstaff_edit_done.phpにpost送信されます。

修正内容をデータベースに登録する画面

staff_edit_done.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{
    
require_once("../common/common.php");
    
$post = sanitize($_POST);
$code = $post["code"];
$name = $post["name"];
$pass = $post["pass"];

$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 = "UPDATE mst_staff SET name=?, 
password=? WHERE code=?";
$stmt = $dbh -> prepare($sql);
$data[] = $name;
$data[] = $pass;
$data[] = $code;
$stmt -> execute($data);
    
$dbh = null;
        
}
catch(Exception $e) {
    print "只今障害が発生しております。
<br><br>";
    print "<a href='../staff_login/
staff_login.html'>ログイン画面へ</a>";
}
?>
    
修正完了しました。<br><br>
<a href="staff_list.php">スタッフ一覧へ</a>

</body>
</html>

staffフォルダ内にstaff_edit_done.phpを作成します。

postでデータを受け取り、データベースに接続します。

SQLは、「UPDATE」文を使ってデータベースの内容を修正できます。

"UPDATE mst_staff(テーブル名) SET name=?, password=?(修正したいカラム) WHERE code=?(修正したいレコード)"; となります。

$data[]でそれぞれの値を格納させて、execute($data); でSQLを実行させます。

この時点で、指定したテーブルのレコード内容が修正されます。

データベースを切断して、修正完了のコメントをのせてスタッフ一覧のリンクを貼っています。

最後に、データベースのテーブルを確認してみましょう。ちゃんと入力した通り変更されていればOKです。

コメントを残す

お名前

コメント



コメント一覧

コメントはまだありません
MENU