前回は、ログイン・ログアウト画面を作りました。
今回は、そのログイン画面から新規会員登録する
画面を作ります。
新規会員登録画面
ファイル名：newmember.html
＜記述例＞
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>新規会員登録</title>
<style type="text/css">
<!--
.txtbox{display: inline-block;margin: 10px;}
h3{color: white;background-color:seagreen;padding: 5px 20px;border-radius: 6px;}
h4{border:solid seagreen;border-width: 1px 1px 5px 20px;padding: 3px 10px;background: honeydew;}
table {margin: 10px auto;padding: 10px;border-collapse: collapse;border: 2px solid seagreen;}
table tr:nth-child(even) {background: mintcream;}
table tr:nth-child(odd) {background: honeydew;}
table tr th,td {border: 1px solid seagreen;padding: 5px 10px; text-align: left;}
table tr th {background-color:mediumaquamarine;}
table .right{text-align: right;}
.btnbox{text-align: center; margin-top: 20px;}
.btn1{color: honeydew;font-size: 16px;background: gray;border-radius: 30px 0 0 30px;padding: 10px 24px;margin: 5px 10px;}
.btn2{color: honeydew;font-size: 16px;background: seagreen;border-radius: 0 30px 30px 0;padding: 10px 24px;margin: 5px 10px;}
.red{color: orangered;}
-->
</style>
</head>
<body>
<main>
<section class="txtbox">
<h3>新規会員登録</h3>
以下の項目をご入力ください。<br>
<form method="post" action="newmember_chk.php">
<table>
<tr>
<th>【お 名 前】<span class="red">(必須)</span></th>
<td><input type="text" name="cname" style="width:200px"></td>
</tr>
<tr>
<th>【メールアドレス】<span class="red">(必須)</span></th>
<td><input type="email" name="email" style="width:200px"></td>
</tr>
<tr>
<th>【パスワード】<span class="red">(必須)</span><br> ※ログイン時に必要</th>
<td><input type="password" name="lpass1" style="width:200px"><br>
※半角英数字でお願いします<br>
<input type="password" name="lpass2" style="width:200px"><br>
※確認のためもう一度入力してください</td>
</tr>
<tr>
<th>【郵便番号】<span class="red">(必須)</span></th>
<td><input type="text" name="postal" style="width:100px" maxlength="7"><br>※半角数字のみ7桁で入力してください
</td>
</tr>
<tr>
<th>【住 所】<span class="red">(必須)</span></th>
<td><input type="text" name="address" style="width:350px"></td>
</tr>
<tr>
<th>【電話番号】<span class="red">(必須)</span></th>
<td><input type="text" name="tel" style="width:200px"></td>
</table>
<div class="btnbox">
<input type="button" value=" 戻 る " onclick="history.back()" class="btn1">
<input type="submit" value="確 認 画 面 へ" class="btn2">
</div>
</form>
</section>
</main>
</body>
</html>＜表示例＞
顧客情報入力画面[inputinfo.html]をもとに
修正していますので説明することはありません。
新規会員登録入力チェック
入力チェックをします。
ファイル名：newmember_chk.php
＜記述例＞
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>新規会員登録入力チェック</title>
<style type="text/css">
<!--
.txtbox{display: inline-block;margin: 10px;}
h3{color: white;background-color:seagreen;padding: 5px 20px;border-radius: 6px;}
h4{background-color:mediumaquamarine;padding: 3px 10px;}
table {margin: 10px auto;padding: 10px;border-collapse: collapse;border: 2px solid seagreen;}
table tr:nth-child(even) {background: mintcream;}
table tr:nth-child(odd) {background: honeydew;}
table tr th,td {border: 1px solid seagreen;padding: 5px 10px; text-align: left;}
table tr th {background-color:mediumaquamarine;}
table .right{text-align: right;}
.btnbox{text-align: center;}
.btn1{color: honeydew;font-size: 16px;background: gray;border-radius: 30px 0 0 30px;padding: 10px 24px;margin: 5px;}
.btn2{color: honeydew;font-size: 16px;background: seagreen;border-radius: 0 30px 30px 0;padding: 10px 24px;margin: 5px;}
.red{color: red;font-weight: bold;}
-->
</style>
</head>
<body>
<main>
<section class="txtbox">
<h3>入力内容の確認</h3>
入力内容に間違いがないかご確認の上 [登録完了] ボタンを押してください。<br>
<?php
require_once('../com_func.php');
$post=sanitize($_POST);
$cname=$post['cname'];
$email=$post['email'];
$postal=$post['postal'];
$address=$post['address'];
$tel=$post['tel'];
$lpass=$post['lpass1'];
$lpass2=$post['lpass2'];
try
{
$dbh=dbconnect();
$dbh->query('SET NAMES utf8');
$sql='SELECT email FROM cust_member WHERE email=?';
$stmt=$dbh->prepare($sql);
$data[]=$email;
$stmt->execute($data);
$dbh=null;
}
catch(Exception $e)
{
print ' ただいま障害により大変ご迷惑をおかけしております。';
exit();
}
$rec=$stmt->fetch(PDO::FETCH_ASSOC);
if($rec==true)
{
print '<br>メールアドレス：'.$email.'<br>';
print '<span class="red">このメールアドレスは既に登録されております。</span><br>';
print '[ログイン画面へ]ボタン押してログインしてください。<br><br>';
print '<button type="button" onclick="location.href='."'cust_login.html'".'" class="btn2">ログイン画面へ</button>';
exit();
}
$flag1=true;
print '<table><tr><th>お名前</th>';
if($cname=='')
{
print '<td class="red">お名前が入力されていません。</td></tr>';
$flag1=false;
}
else
{
print '<td>'.$cname.'</td></tr>';
}
print '<tr><th>メールアドレス</th>';
if(preg_match('/^[\w\-\.]+\@[\w\-\.]+\.([a-z]+)$/',$email)==0)
{
print '<td class="red">正確に入力してください。</td></tr>';
$flag1=false;
}
else
{
print '<td>'.$email.'</td></tr>';
}
print '<tr><th>郵便番号</th>';
if(preg_match('/^[0-9]{7}+$/',$postal)==0)
{
print '<td class="red">半角数字7桁です。';
$flag1=false;
}
else
{
print '<td>'.substr($postal,0,3).'-'.substr($postal,3,4);
}
print '<tr><th>住 所</th>';
if($address=='')
{
print '<td class="red">住所が入力されていません。</td></tr>';
$flag1=false;
}
else
{
print '<td>'.$address.'</td></tr>';
}
print '<tr><th>電話番号</th>';
if(preg_match('/^\d{2,5}-?\d{2,5}-?\d{4,5}$/',$tel)==0)
{
print '<td class="red">電話番号を正確に入力してください。</td></tr>';
$flag1=false;
}
else
{
print '<td>'.$tel.'</td></tr>';
}
print '<tr><th>パスワード</th><td>';
if($lpass=='')
{
print '<span class="red">パスワードが入力されていません。</span>';
$flag1=false;
}
elseif($lpass!=$lpass2)
{
print '<span class="red">パスワードが一致しません。</span>';
$flag1=false;
}
else
{
print 'パスワードが入力されました。';
}
print '</td></tr>';
print '</table>';
if($flag1==true)
{
print '<form method="post" action="newmember_end.php">';
print '<input type="hidden" name="cname" value="'.$cname.'">';
print '<input type="hidden" name="email" value="'.$email.'">';
print '<input type="hidden" name="postal" value="'.$postal.'">';
print '<input type="hidden" name="address" value="'.$address.'">';
print '<input type="hidden" name="tel" value="'.$tel.'">';
print '<input type="hidden" name="lpass" value="'.$lpass.'"><br>';
print '<div class="btnbox">';
print '<input type="button" onclick="history.back()" class="btn1" value=" 戻 る ">';
print '<input type="submit" value="登 録 完 了" class="btn2">';
print '</form>';
}
else
{
print '<span class="red">入力内容に誤りがあります。</span><br>';
print '[戻る]ボタン押して入力を訂正してください。<br>';
print '<button type="button" onclick="history.back()" class="btn1"> 戻 る </button>';
}
?>
</section>
</main>
</body>
</html>＜表示例＞
顧客情報入力チェック[inputinfo_chk.php]をもとに
修正しました。
以前書いていた、ログインID（メールアドレス）の
重複チェックを追加しました。
43～59行目：データベース接続と切断処理。
48行目：SELECT文で[cust_member]テーブルのemailの中で
今回入力した[$email]と同じものがあるのかを
チェックしています。
61行目：[$rec]にSELECT文からのデータを代入しています。
63行目：[$rec]が真(true)なら[cust_member]テーブルに
登録済みなのでエラー表示しています。
同じように、顧客情報入力チェック[inputinfo_chk.php]も
重複チェックを追加します。
45：try
46：{
47：$dbh=dbconnect();
48：$dbh->query('SET NAMES utf8');
49：
50：$sql='SELECT email FROM cust_order WHERE email=?';
51：$stmt=$dbh->prepare($sql);
52：$data[]=$email;
53：$stmt->execute($data);
54：
55：$dbh=null;
56：}
57：catch(Exception $e)
58：{
59： print ' ただいま障害により大変ご迷惑をおかけしております。';
60： exit();
61：}
62：
63：$rec=$stmt->fetch(PDO::FETCH_ASSOC);
64：
65：if($rec==true)
66：{
67： print '<br>メールアドレス：'.$email.'<br>';
68： print '<span class="red">このメールアドレスは既に登録されております。</span><br>';
69： print '[ログイン画面へ]ボタン押してログインしてください。<br><br>';
70： print '<button type="button" onclick="location.href='."'cust_login.html'".'" class="btn2">ログイン画面へ</button>';
71： exit();
72：}
73：45行目～61行目を追加し、79～97行目を修正しました。
新規会員登録完了
登録処理です。
ファイル名：newmember_end.php
＜記述例＞
<?php
session_start();
session_regenerate_id(true);
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>新規会員登録完了</title>
<style type="text/css">
<!--
.txtbox{display: inline-block;margin: 10px;}
h4{background-color:mediumaquamarine;padding: 3px 10px;}
table {margin: 10px auto;padding: 10px;border-collapse: collapse;border: 2px solid seagreen;}
table tr:nth-child(even) {background: mintcream;}
table tr:nth-child(odd) {background: honeydew;}
table tr th,td {border: 1px solid seagreen;padding: 5px 10px; text-align: left;}
table tr th {background-color:mediumaquamarine;}
table .right{text-align: right;}
.btnbox{text-align: center;}
.btn1{color: honeydew;font-size: 16px;background: gray;border-radius: 30px 0 0 30px;padding: 10px 24px;margin: 5px 10px;}
-->
</style>
</head>
<body>
<main>
<section class="txtbox">
<?php
require_once('../com_func.php');
$post=sanitize($_POST);
$cname=$post['cname'];
$email=$post['email'];
$postal=$post['postal'];
$address=$post['address'];
$tel=$post['tel'];
$lpass=$post['lpass'];
print $cname.' 様<br>';
print '新規会員にご登録いただきありがとうございました。<br>';
print '次回からメールアドレスとパスワードでログインし、<br>';
print 'ご注文が簡単にできるようになります。<br>';
print '登録された内容は以下の通りです。<br>';
print '<h4>会員登録内容</h4>';
print '<table><tr><th>お名前</th>';
print '<td>'.$cname.'</td></tr>';
print '<tr><th>メールアドレス</th>';
print '<td>'.$email.'</td></tr>';
print '<tr><th>郵便番号</th>';
print '<td>'.substr($postal,0,3).'-'.substr($postal,3,4);
print '<tr><th>住所</th>';
print '<td>'.$address.'</td></tr>';
print '<tr><th>電話番号</th>';
print '<td>'.$tel.'</td></tr>';
print '</table>';
try
{
$dbh=dbconnect();
$dbh->query('SET NAMES utf8');
$sql='LOCK TABLES cust_member WRITE';
$stmt=$dbh->prepare($sql);
$stmt->execute();
$sql='INSERT INTO cust_member(pass,name,email,postal,address,tel) VALUES(?,?,?,?,?,?)';
$stmt=$dbh->prepare($sql);
$data[]=md5($lpass);
$data[]=$cname;
$data[]=$email;
$data[]=$postal;
$data[]=$address;
$data[]=$tel;
$stmt->execute($data);
$dbh=null;
}
catch(Exception $e)
{
print ' ただいま障害により大変ご迷惑をおかけしております。';
exit();
}
?>
<br>
<button class="btn1" onclick="location.href='../item_list.php'">商品一覧へ</button>
</section>
</main>
</body>
</html>顧客情報入力完了[inputinfo_end.php]をもとに
修正しました。
今回は以下の記事のファイルを修正しました。
動作確認
[newmember.html]を実行し、入力ミスをした場合、
ちゃんとエラー表示されます。
登録済みのメールアドレスを入力すると、
エラー表示されます。
重複チェックも大丈夫みたいです。
ここまで、新規会員登録を作成しました。
コメント