2015年4月16日

[教學] PHP & MySQL 學習筆記 第13堂(留言板建置:後台設計)

非常抱歉,關於部落格內 PHP 的部分目前已經停止維護,因本人已經很久沒有寫 PHP ,且文章中所使用的 PHP 版本偏舊,希望有心學習 PHP 的朋友們,可以參考 Codecademy 的課程,或近一步嘗試 Laravel 這個 PHP 框架(可透過 laracasts 學習),若有找不到錯的學習資源也歡迎在留言串分享,方便有需要的人能夠有更多學習的管道!
在這一堂課我們要練習建立一個留言板系統,同時包含它的前台(網友看到的部分)和後台(管理者看到的部分)

以下是這堂課的結果:


本次會學習到的函數共包含:

mysql_query("update 資料表 set 欄位名稱 = ' ', 欄位名稱 = ' ', ...  where 欄位名稱 = ' ')"):將資料更新入MySQL資料表中。
mysel_query("delete from 資料表 where 欄位名稱=' ' ")

管理員頁面


STEP 1設計管理員頁面

首先,複製p13-show.php這個檔案,當作我們管理員頁面的基礎,並且取名為「p13-admin.php」


在新的p13-admin,php檔案,就可以開始作一些編輯了,像是加入標題(管理員頁面)


然後在表格的第一列中,利用td我們加上一段,「刪除」和「回覆」。


頁面完成後,就會長的像這個樣子:


STEP 2加入PHP語法

首先,我們希望當管理員點選回覆之後,就可以進到「回覆頁面」,而且是要針對那篇文章來回覆,所以我們把超連結先連到reply.php這個頁面,後面加上變數id。至於id要等於多少呢?id就要等於我們給這篇留言的流水編號,也就是guestID。


這時候點選回覆的時候,就會連到回覆頁面,而且後面會加上變數id。


透過類似的方法,我們也為「刪除」,建立連結


回覆頁面


STEP 1回覆頁面設計

我們一樣複製p13-show.php這個頁面加以修改,在最下面的地方,新增一個textarea,讓管理員可以輸入要回覆的內容



搭配上一些CSS後,版面可以變這樣子,這時候,還是會顯示所有的留言資料而不是根據網址後的id顯示。

STEP 2PHP語法撰寫

首先,我們可以在網頁的最上方,輸入以下的PHP語法,說明一下這些語法:

第一行「$id...」,是把網址上id這個變數抓下來
第二行「$guestReply...」則是把管理員輸入的留言傳到變數guestReply
第三行「$data ...」加上where這個語法,讓網頁上只會出現我們要回覆的那比留言(也就是網址上的變數id)
第五行「mysql...」則是新的語法,我們利用update這個指令,來把輸入的回覆更新進去資料表當中,update的用法是:「update 資料表名稱 set 欄位名稱 = ' ', 欄位名稱 = ' ' where 欄位名稱 = ' '」,最後一個where是要指定回覆的內容要更新到哪一個留言當中,否則會更新到全部的留言內容!


寫完之後,該頁面只會出現要回覆的那則留言


最後,為了避免管理員一點回覆,就自動把回覆內容更新進入資料表當中,我們要使用isset 這個指令來避免這樣的事發生。


最後我們加上header這個指令,當管理員按下送出後,就會回到留言板的主畫面(p13-admin.php)


STEP 3更新留言板頁面

我們在留言版(p13-show.php)中的最下面,加上兩列,是顯示站長回覆的表格。


加入後的樣子長的像這樣


但是這個做還不夠,因為如果站長沒有回覆的情況下,它還是會跳出站長回覆的內容,這樣白白的並不太好看,所以我們希望只有在有回覆的情況下才產生站長回覆的表格。

我們同樣可以透過PHP來達到這樣的效果,邏輯是當guestReply不為空白時(也就是管理員有回覆的狀況下),在顯示站長回覆的表格


顯示的結果就會像這樣:


STEP 4更新管理員檢視頁面

同樣的語法也要複製到管理員頁面(p13-admin.php),這樣管理員回覆完留言後才能看到自己的留言。


修改後,頁面就會長成這樣子


刪除頁面

刪除頁面的寫法很簡單,我們只需要用到一個指令delete from,這個語法的用法是這樣的mysel_query("delete from 資料表 where 欄位名稱=' ' "),所以我們可以建立一個頁面,取名為p13-delete.php,內容只要在最上面的地方加入PHP語法,這段語法的意思,刪除guestID = id的這筆資料,然後回到p13-admin.php的管理者頁面。


安全性問題


寫到這裡,其實已經把整個留言板系統建置好了,但是這個留言板系統目前仍有很大的安全性問題。

這個安全性問題是,雖然登入的時候要輸入帳號密碼才能進入留言板管理頁面,但是如果你知道管理頁面的網址的話,網友將可以繞過登入頁面,直接進入管理員頁面!!


 為了避免這個問題,我們需要透過SESSIONCOOKIE來解決,當網友成功登入後,我們給它一個SESSION


接著,在每一個管理員才能看到的頁面中(p13-admin.php和p13-reply.php) ,都要加入下面的語法,想法是,如果我沒有正確的Session,請都導回login頁面,這樣就可以解決剛剛所提到的安全性問題了。


程式碼

p13-show.php
<?php 
require("connect2.php");
$data=mysql_query('select * from guest order by guestTime desc')//讓資料由最新呈現到最舊
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<title>自製留言板</title>

<style>
.top{
 margin:auto;
 width:60vw;
 text-align:right;
 padding:15vh 0 0 0;
 font-family:微軟正黑體;
}
/*.nav{
 background-color:#339;
 padding: 10px 0px;
 }*/
.nav a {
  color: #5a5a5a;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
}

.nav li {
  display: inline;
}
 .CSSTableGenerator {
 margin:auto;
 padding:0px;
 width:60vw;
 }
 .CSSTableGenerator table{
    border-collapse: collapse;
    border-spacing: 0;
 width:100%;
 height:100%;
 margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
 -moz-border-radius-bottomright:9px;
 -webkit-border-bottom-right-radius:9px;
 border-bottom-right-radius:9px;
}
.CSSTableGenerator table tr:first-child td:first-child {
 -moz-border-radius-topleft:9px;
 -webkit-border-top-left-radius:9px;
 border-top-left-radius:9px;
}
.CSSTableGenerator table tr:first-child td:last-child {
 -moz-border-radius-topright:9px;
 -webkit-border-top-right-radius:9px;
 border-top-right-radius:9px;
 
}.CSSTableGenerator tr:last-child td:first-child{
 -moz-border-radius-bottomleft:9px;
 -webkit-border-bottom-left-radius:9px;
 border-bottom-left-radius:9px;
 
}.CSSTableGenerator tr:hover td{
 background-color:#005fbf;
 color:white;
}
.CSSTableGenerator td{
 vertical-align:middle;
 background-color:#e5e5e5;
 border:1px solid #999999;
 border-width:0px 1px 1px 0px;
 text-align:left;
 padding:8px;
 font-size:16px;
 font-family:Arial,微軟正黑體;
 font-weight:normal;
 color:#000000;
}.CSSTableGenerator tr:last-child td{
 border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
 border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
 border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
  text-align:center;
  font-size:20px;
  font-family:Arial, 微軟正黑體;
  font-weight:bold;
  color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
}

 
</style>
</head>

<body>
<div class="nav nav-tabs">
 <div class="container">
     <ul class="pull-left nav nav-tabs">
         <li><a href="https://pjchender.blogspot.tw/">Home</a></li>
         <li><a href="https://pjchender.er-webs.com/about/">About</a></li>
        </ul>
     <ul class="pull-right nav nav-tabs">
          <li><a href="p13-login.php">Log In</a></li>
        </ul>
    </div>
</div>
<div class="top">
 <a href="p13-post.php"><button type="button" class="btn btn-primary btn-lg">我要留言</button></a>
</div>
      
<p>&nbsp;</p>
<p>&nbsp;</p>

<?php
for($i=1;$i<=mysql_num_rows($data);$i++){
 $rs=mysql_fetch_assoc($data);
?>
<div class="container">
  <div class="CSSTableGenerator">
      <table align="center">
            <tr>
              <td><?php echo $rs['guestSubject']?></td>
            </tr>
            <tr>
              <td width="25%">暱稱</td>
              <td width="75%"><?php echo $rs['guestName']?></td>
            </tr>
            <tr>
              <td>信箱</td>
              <td>******</td>
            </tr>
            <tr>
              <td>性別</td>
              <td><?php echo $rs['guestGender']?></td>
            </tr>
            <tr>
              <td>留言內容</td>
              <td><?php echo $rs['guestContent']?></td>
            </tr>
            <?php if($rs['guestReply']!=""){?>
            <tr>
              <td colspan="2" style="background:#999; color:white; text-align:center">站長回覆</td>
            </tr>
            <tr>
              <td colspan="2"><?php echo $rs['guestReply']?></td>
            </tr>
            <?php } ?>
        </table>
 </div>
</div>
<br />
<?php } ?>


</body>
</html>

p13-post.php
<?php
require("connect2.php");

$guestName=$_POST['guestName'];
$guestEmail=$_POST['guestEmail'];
$guestGender=$_POST['guestGender'];
$guestSubject=$_POST['guestSubject'];
$guestContent=$_POST['guestContent'];
$guestTime = date("Y:m:d H:i:s",time()+28800);

if(isset($guestName)){
mysql_query("insert into guest value('','$guestName','$guestEmail','$guestGender','$guestSubject','$guestTime','$guestContent','','')");
header("location:p13-show.php");
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>我要留言</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
</head>
<style>
 .container{
  margin:auto;
  background-color:#f5f5f5;
  width:800px;
  padding-bottom: 20px;
 }
 .button{
  text-align:center;
  padding:20px 0;
 }
 .top h3{
  font-family:微軟正黑體;
  text-align:center;
  padding:10px 0;
 }
 .form-group{
  font-family:微軟正黑體;
  font-size:16px;
 }
</style>
<body>
<div class="container">
 <div class="top">
    <h3>新增留言</h3>
    </div>
    <form id="form1" name="form1" method="post" action="" class="form-horizontal">
        <div class="form-group">
            <label for="guestName" class="col-sm-4 control-label">暱稱:</label>
            <div class="col-sm-6">
                <input type="text" class="form-control" placeholder="您的暱稱" name="guestName" id="guestName" />
            </div>
        </div>
        <div class="form-group">
            <label for="guestEmail" class="col-sm-4 control-label">信箱:</label>
            <div class="col-sm-6">
                <input type="text" class="form-control" placeholder="您的信箱" name="guestEmail" id="guestEmail" />
            </div>
        </div>
        <div class="form-group">
            <label for="guestGender" class="col-sm-4 control-label">性別:</label>
            <label class="radio-inline">
                <input type="radio" name="guestGender" id="radio" value="男" /> 男
            </label>
            <label class="radio-inline">
                <input type="radio" name="guestGender" id="radio2" value="女" />女
            </label>
        </div>
        <div class="form-group">
            <label for="guestSubject" class="col-sm-4 control-label">留言主旨:</label>
            <div class="col-sm-6">
              <input type="text" class="form-control" name="guestSubject" id="guestSubject" />
            </div>
        </div>
        <div class="form-group">
          <label for="guestContent" class="col-sm-4 control-label">留言內容:</label>
          <div class="col-sm-6">
              <textarea name="guestContent" class="form-control" id="guestContent" rows="5"></textarea>
          </div>
        </div>
        <div class="button">
            <input type="submit" name="button" id="button" value="送出" class="btn"/>
        </div>
    </form>
    
</div>
</body>
</html>

p13-login.php
<?php
session_start();

if(isset($_POST['usr'])){
require("connect2.php");
$username=$_POST['usr'];
$password=$_POST['pwd'];
$data=mysql_query("select * from admin where usr = '$username' and pwd = '$password'");
 if(mysql_num_rows($data)>=1){
  header("location:p13-admin.php");
  $_SESSION['v']="yes";
 }else{
  header("location:p13-login.php?msg=error");
 }
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>管理員登入介面</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<style>
 *{
  padding:0;
  margin:0;
 }
 .container{
  padding:20px 0;
        background-color:#f5f5f5;
        width:800px;
 }
 h2{
  font-family:微軟正黑體;
  padding:0 0 20px 0;
 }
 .btn{
  font-size:20px;
  font-family:微軟正黑體;
 }
 .respond{
  text-align:center;
  padding:20px 0;
  font-family:微軟正黑體;
  font-size:20px;
 }
</style>
</head>

<body>
<div class="container">
 <h2 align="center">管理員登入</h2>
    <form class="form-horizontal" role="form" id="form1" name="form1" method="post" action="">
    
    <div class="form-group">
        <label class="control-label col-sm-4" for="usr">UserName:</label>
        <div class="col-sm-4">
            <input name="usr" type="text" class="form-control" id="usr" placeholder="Enter username">
        </div>
    </div>
    
    <div class="form-group">
        <label class="control-label col-sm-4 for="pwd">Password:</label>
        <div class="col-sm-4">
            <input name="pwd" type="password" class="form-control" id="pwd" placeholder="Enter password">
        </div>
    </div>
    <div>
        <div align="center" style="padding-top:30px">
            <input name="button" type="submit" class="btn" id="button" value="確認" />
        </div>
      </div>
    </form>
    <div class="respond">
    <?php
        if($_GET['msg']=="error"){
            echo'<p class="bg-danger">查無此人</p>';
        }
    ?>
    </div>
</div>
</body>
</html>

p13-admin.php
<?php 
session_start();
if($_SESSION['v']!="yes"){
 header("location:p13-login.php");
}

require("connect2.php");
$data=mysql_query('select * from guest order by guestTime desc')//讓資料由最新呈現到最舊
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<title>管理員頁面</title>

<style>
.top{
 margin:auto;
 width:60vw;
 text-align:center;
 padding:30px 0 0 0;
 font-family:微軟正黑體;
 font-size:18px;
}
/*.nav{
 background-color:#339;
 padding: 10px 0px;
 }*/
.nav a {
  color: #5a5a5a;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
}

.nav li {
  display: inline;
}
.CSSTableGenerator {
 margin:auto;
 padding:0px;
 width:60vw;
 }
 .CSSTableGenerator table{
    border-collapse: collapse;
    border-spacing: 0;
 width:100%;
 height:100%;
 margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
 -moz-border-radius-bottomright:9px;
 -webkit-border-bottom-right-radius:9px;
 border-bottom-right-radius:9px;
}
.CSSTableGenerator table tr:first-child td:first-child {
 -moz-border-radius-topleft:9px;
 -webkit-border-top-left-radius:9px;
 border-top-left-radius:9px;
}
.CSSTableGenerator table tr:first-child td:last-child {
 -moz-border-radius-topright:9px;
 -webkit-border-top-right-radius:9px;
 border-top-right-radius:9px;
 
}.CSSTableGenerator tr:last-child td:first-child{
 -moz-border-radius-bottomleft:9px;
 -webkit-border-bottom-left-radius:9px;
 border-bottom-left-radius:9px;
 
}.CSSTableGenerator a{
 background-color:#005fbf;
 color:white;
}

}.CSSTableGenerator tr:hover td{
 background-color:#005fbf;
 color:white;
}
.CSSTableGenerator td{
 vertical-align:middle;
 background-color:#e5e5e5;
 border:1px solid #999999;
 border-width:0px 1px 1px 0px;
 text-align:left;
 padding:8px;
 font-size:16px;
 font-family:Arial,微軟正黑體;
 font-weight:normal;
 color:#000000;
}.CSSTableGenerator tr:last-child td{
 border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
 border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
 border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
  text-align:center;
  font-size:20px;
  font-family:Arial, 微軟正黑體;
  font-weight:bold;
  color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
}

 
</style>
</head>

<body>
<div class="nav nav-tabs">
 <div class="container">
     <ul class="pull-left nav nav-tabs">
         <li><a href="https://pjchender.blogspot.tw/">Home</a></li>
         <li><a href="https://pjchender.er-webs.com/about/">About</a></li>
        </ul>
     <ul class="pull-right nav nav-tabs">
          <li><a href="p13-login.php">Log In</a></li>
        </ul>
    </div>
</div>
<div class="top">
 <h3>管理員頁面</h3>
</div>
      
<p>&nbsp;</p>
<p>&nbsp;</p>

<?php
for($i=1;$i<=mysql_num_rows($data);$i++){
 $rs=mysql_fetch_assoc($data);
?>
<div class="container">
  <div class="CSSTableGenerator">
      <table align="center">
            <tr>
              <td><?php echo $rs['guestSubject']?></td>
              <td><a href="p13-reply.php?id=<?php echo $rs['guestID'] ?>">回覆</a>
              <a href="p13-delete.php?id=<?php echo $rs['guestID']?>"> 刪除</a></td>
            </tr>
            <tr>
              <td width="25%">暱稱</td>
              <td width="75%"><?php echo $rs['guestName']?></td>
            </tr>
            <tr>
              <td>信箱</td>
              <td><?php echo $rs['guestEmail']?></td>
            </tr>
            <tr>
              <td>性別</td>
              <td><?php echo $rs['guestGender']?></td>
            </tr>
            <tr>
              <td>留言內容</td>
              <td><?php echo $rs['guestContent']?></td>
            </tr>
            <?php if($rs['guestReply']!=""){?>
            <tr>
              <td colspan="2" style="background:#999; color:white; text-align:center">站長回覆</td>
            </tr>
            <tr>
              <td colspan="2"><?php echo $rs['guestReply']?></td>
            </tr>
            <?php } ?>
        </table>
 </div>
</div>
<br />
<?php } ?>


</body>
</html>

p13-reply.php
<?php 
session_start();
if($_SESSION['v']!="yes"){
 header("location:p13-login.php");
}

require("connect2.php");
$id=$_GET['id'];
$data=mysql_query("select * from guest where guestID='$id'");
if(isset($_POST['guestReply'])){
 $guestReply=$_POST['guestReply'];
 $time=date("Y:m:d H:i:s",time()+28800);
 mysql_query("update guest set guestReply='$guestReply',guestReplyTime = '$time' where guestID = '$id'");
 header("location:p13-admin.php");
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<title>自製留言板</title>

<style>
.reply .container{
  margin:auto;
  background-color:#f5f5f5;
  width:800px;
  padding:20px 20px 40px;;
  font-size:20px;
  font-family:微軟正黑體;
 }
.reply .container .button{
  text-align:right;
  padding: 10px;
 }
.nav a {
  color: #5a5a5a;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
}

.nav li {
  display: inline;
}
 .CSSTableGenerator {
 margin:auto;
 padding:0px;
 width:60vw;
 }
 .CSSTableGenerator table{
    border-collapse: collapse;
    border-spacing: 0;
 width:100%;
 height:100%;
 margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
 -moz-border-radius-bottomright:9px;
 -webkit-border-bottom-right-radius:9px;
 border-bottom-right-radius:9px;
}
.CSSTableGenerator table tr:first-child td:first-child {
 -moz-border-radius-topleft:9px;
 -webkit-border-top-left-radius:9px;
 border-top-left-radius:9px;
}
.CSSTableGenerator table tr:first-child td:last-child {
 -moz-border-radius-topright:9px;
 -webkit-border-top-right-radius:9px;
 border-top-right-radius:9px;
 
}.CSSTableGenerator tr:last-child td:first-child{
 -moz-border-radius-bottomleft:9px;
 -webkit-border-bottom-left-radius:9px;
 border-bottom-left-radius:9px;
 
}.CSSTableGenerator tr:hover td{
 background-color:#005fbf;
 color:white;
}
.CSSTableGenerator td{
 vertical-align:middle;
 background-color:#e5e5e5;
 border:1px solid #999999;
 border-width:0px 1px 1px 0px;
 text-align:left;
 padding:8px;
 font-size:16px;
 font-family:Arial,微軟正黑體;
 font-weight:normal;
 color:#000000;
}.CSSTableGenerator tr:last-child td{
 border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
 border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
 border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
  text-align:center;
  font-size:20px;
  font-family:Arial, 微軟正黑體;
  font-weight:bold;
  color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
  background:-o-linear-gradient(bottom, #005fbf 5%, #005fbf 100%); 
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #005fbf) );
  background:-moz-linear-gradient( center top, #005fbf 5%, #005fbf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#005fbf"); 
  background: -o-linear-gradient(top,#005fbf,005fbf);
  background-color:#005fbf;
}

 
</style>
</head>

<body>
<div class="nav nav-tabs">
 <div class="container">
     <ul class="pull-left nav nav-tabs">
         <li><a href="https://pjchender.blogspot.tw/">Home</a></li>
         <li><a href="https://pjchender.er-webs.com/about/">About</a></li>
        </ul>
     <ul class="pull-right nav nav-tabs">
          <li><a href="p13-login.php">Log In</a></li>
        </ul>
    </div>
</div>
<br />
<br />
<?php
for($i=1;$i<=mysql_num_rows($data);$i++){
 $rs=mysql_fetch_assoc($data);
?>
<div class="container">
  <div class="CSSTableGenerator">
      <table align="center">
            <tr>
              <td><?php echo $rs['guestSubject']?></td>
            </tr>
            <tr>
              <td width="25%">暱稱</td>
              <td width="75%"><?php echo $rs['guestName']?></td>
            </tr>
            <tr>
              <td>信箱</td>
              <td><?php echo $rs['guestEmail']?></td>
            </tr>
            <tr>
              <td>性別</td>
              <td><?php echo $rs['guestGender']?></td>
            </tr>
            <tr>
              <td>留言內容</td>
              <td><?php echo $rs['guestContent']?></td>
            </tr>
        </table>
 </div>
</div>
<br />
<?php } ?>
<div class="reply">
 <div class="container">
     <form id="form1" name="form1" method="post" action="">
         <div class="form-group">
             <label for="guestReply" class="col-ms-6 control-label">回覆內容:</label>
                <div class="col-ms-6">
                 <textarea class="form-control" rows="8" id="guestReply" name="guestReply"/></textarea>
                </div>
            </div>
            <div class="button">
             <input type="submit" class="btn" value="回覆"/>
            </div>
        </form>
    </div>
</div>

</body>
</html>
p13-delete.php
<?php 
session_start();
if($_SESSION['v']!="yes"){
 header("location:p13-login.php");
}

require("connect2.php");
$id=$_GET['id'];
mysql_query("delete from guest where guestID = '$id'");
header("location:p13-admin.php");
?>
結果
寫到這裡就大功告成了

自製留言板
(管理者帳號:pjchender;密碼12345678)
// 2015/06/20 基於安全性和本人管理方便,自製留言版的帳號密碼已做變更



以上內容均為本人在馬老師雲端研究室學習所整理之筆記

0 意見:

張貼留言