WEB ◆ TS Library ◆ 熱衷分享 ◆ 享受教學相長 ◆ 無形的網絡擁有熱情溫度的傳遞

3-6n. 新訊系統的刪除工作

設計連結的方法

admin_news.php 檔案中,設計刪除的連結。

<a href="./admin_news_delete.php?news_id=<?php echo $row_RS_news['news_id']; ?>" 
           class="w3-button w3-padding-small modify-btn" data-title="刪除新訊">刪除</a

設計 admin_news_delete.php:在表單中顯示單筆新訊再進行修改

建立資料集:要刪除的新訊資料

<?php
require_once('../shared/conn_pdo.php');
 
$news_id = $_GET['news_id'];
//資料集:新訊簡介清單=========================================
try{
  $sql_str = "SELECT news.*, news_class.news_class_name
              FROM news 
              LEFT JOIN news_class
              ON news.news_class_id = news_class.news_class_id
              WHERE news_id = :news_id";
 
  $RS_news = $conn->prepare($sql_str);
  $RS_news->bindParam(':news_id', $news_id);
  $RS_news->execute();
  $row_RS_news = $RS_news->fetch(PDO::FETCH_ASSOC);
}
catch (PDOException $e ){
  die("Errpr!: ". $e->getMessage());
}
?>

顯示要刪除的新訊資料

<div class="w3-row w3-text-grey form-news-result">
 
  <div class="w3-third w3-center">
    <!-- 影像圖片 -->
    <?php
    if( $row_RS_news['news_img_s']!='' ){
      echo '<img src="../img_news/'.$row_RS_news['news_img_s'].'" class="news_img" alt="">';
    }else{
      echo '<img src="../img_layout/pre_img_news.png" class="news_img" alt="">';
    }
    ?>
  </div>
 
  <div class="w3-twothird">
 
    <div class="w3-row">
      <div class="w3-col"><i class="w3-xxlarge fa fa-folder-open"></i></div>
      <div class="w3-rest select_news_class">
        <!-- 新訊分類 -->
        [<?php echo $row_RS_news['news_class_id']; ?>]
        <?php echo $row_RS_news['news_class_name']; ?>
      </div>
    </div>
 
    <div class="w3-row">
      <div class="w3-col"><i class="w3-xxlarge fa fa-flag"></i></div>
      <div class="w3-rest">
        <!-- 新訊標題 -->
        <?php echo $row_RS_news['news_title']; ?>
      </div>
    </div>
 
    <div class="w3-row">
      <div class="w3-col"><i class="w3-xxlarge fa fa-commenting"></i></div>
      <div class="w3-rest">
        <!-- 新訊內容 -->
        <?php echo nl2br($row_RS_news['news_content']); ?>
      </div>
    </div>
 
    <div class="w3-row">
      <div class="w3-col"><i class="w3-xxlarge fa fa-map-marker"></i></div>
      <div class="w3-rest">
        <!-- 是否為焦點新訊, 是否顯示 -->
        <?php $row_RS_news['news_focus']==1?$focus='是':$focus='不是'; ?>
        <?php echo $focus; ?>焦點新聞
 
        <div class="w3-right">
          <?php $row_RS_news['news_show']==1?$show='是':$show='不'; ?>
          <?php echo $show; ?>顯示
        </div>
      </div>
    </div>
 
  </div>
</div>

增加確認刪除的表單

<form method="post" action="admin_news_process.php" class="w3-text-grey w3-row form-news">
  <div class="form-btn-area">
    <input type="submit" class="form-btn" value="確定刪除新聞" style="width:100%!important;">
  </div>
 
  <input type="hidden" name="news_id" value="<?php echo $row_RS_news['news_id']; ?>">
  <input type="hidden" name="news_img" value="<?php echo $row_RS_news['news_img']; ?>">
  <input type="hidden" name="news_img_s" value="<?php echo $row_RS_news['news_img_s']; ?>">
 
  <input type="hidden" name="form-name" value="form-news-delete">
</form>

準備彈出的區塊

這個部份在前一節已經設計好了。

<div id="w3-modal" class="w3-modal" style="z-index:9999">
  <div class="w3-modal-content w3-animate-top w3-card-4">
    <header class="w3-container w3-dark-grey">
      <a href="javascript:;" class="w3-right w3-xlarge w3-modal-close">&times;</a>
      <h2 class="w3-xlarge w3-text-light-grey" style="padding:0">ABC</h2>
    </header>
 
    <div class="w3-container w3-padding-24 content"></div>
 
    <footer class="w3-container w3-dark-grey">&nbsp;</footer>
  </div>
</div>

設計 JS 中的 AJAX 技術, 以異步更新的技術載入 admin_news_detail.php 檔案

這個部份在前一節已經設計好了。

<script>
$(function(){
  $('.modify-btn, .delete-btn, .detail-btn').on('click', function(){
    var datatitle = $(this).attr('data-title');
    $('.w3-modal header h2').html(datatitle);
    
    var atarget = $(this).attr('href');
    $.get(atarget, function(data){
      $('#w3-modal .content').html(data);
      $('#w3-modal').show();
    });
    return false;
  });
 
  $('.w3-modal-close').on('click',function(){
    $(this).parents('.w3-modal').hide();
  });
 
});
</script>

最後設計 admin_news_process.php 檔案, 刪除資料

if( isset($_POST['form-name']) && $_POST['form-name']=='form-news-delete' ){
  try {
    $sql_str = "DELETE FROM news WHERE news_id = :news_id";
    $stmt = $conn -> prepare($sql_str);
    $stmt -> bindParam(':news_id', $news_id);
    $stmt -> execute();
 
    $news_img = $_POST['news_img'];
    $news_img_s = $_POST['news_img_s'];
 
    //如果有上傳的圖片, 接著刪除已上傳的圖片
    if($news_img!=''){ unlink('../img_news/'.$news_img); }
    if($news_img_s!=''){ unlink('../img_news/'.$news_img_s); }
 
    header('Location:./?page=admin_news');
  } 
  catch ( PDOException $e ){
    die("Errpr!: ". $e->getMessage());
  }
}

 

 

go TOP