PHP+MySql+Bootstrap實現用戶界面數據的刪除、修改與批量選擇刪除——實例操作

来源:http://www.cnblogs.com/jly144000/archive/2017/09/01/7465325.html
-Advertisement-
Play Games

第一步:在資料庫中建立要操作的信息表 如下圖: 第二步:實現對該信息表中數據的刪除功能 代碼如下:main(主頁面) <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>刪除功能</title> <script src="bootst ...


第一步:在資料庫中建立要操作的信息表 如下圖:

第二步:實現對該信息表中數據的刪除功能

代碼如下:main(主頁面)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>刪除功能</title>
        <script src="bootstrap/js/jquery-1.11.2.min.js"></script>  //引入這裡的三個文件
        <script src="bootstrap/js/bootstrap.min.js"></script>
        <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div style="height: 100px;"></div>                    
        <form action="batch_process.php" method="post">  //利用form表單進行提交頁面
        <table class="table table-hover" style="max-width: 800px;margin-left: 260px;">
              <thead>
                <tr>
                  <th><input type="checkbox" onclick="qx(this)"/>&nbsp;&nbsp;&nbsp;代號</th>
                  <th>名稱</th>
                  <th>價格</th>
                  <th>產地</th>
                  <th>庫存</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
<?php
              $db = new MYSQLi("localhost","root","","0710_info");
              $sql = "select * from fruit";
              $result = $db->query($sql);
              $arr = $result->fetch_all();
              
              foreach($arr as $v){
                  echo "<tr>
                  <td><input type='checkbox' class='ck' value='{$v[0]}' name='sub[ ]'/>&nbsp;&nbsp;&nbsp;{$v[0]}</td>
                  <td>{$v[1]}</td>
                  <td>{$v[2]}</td>
                  <td>{$v[3]}</td>
                  <td>{$v[4]}</td>
                  <td>
                          <a href='del_processpage.php?code={$v[0]}' onclick=\"return confirm('確定刪除嗎?')\">  //防止失誤操作處理
                              <button type='button' class='btn btn-primary btn-xs'>刪除</button>
                          </a>
                          <a href='update_page.php?code={$v[0]}' onclick=\"return confirm('確定修改嗎?')\">
                              <button type='button' class='btn btn-primary btn-xs'>修改</button>
                          </a>
                  </td>
                </tr>";
              }
?>
              </tbody>
        </table>
            <button type="submit" class="btn btn-danger btn-xs" style="margin-left: 260px;">批量刪除</button>
        </form>
    </body>

 //這裡的JS操作為第四步批量刪除的批量選擇按鈕的點擊事件操作(同第四步)
    <script>
        function qx(qx){
            var ck = document.getElementsByClassName("ck");
            for(var i=0;i<ck.length;i++){        
            ck[i].checked=qx.checked;
        }
    }        
    </script>
</html>

delete(刪除處理頁面)

<?php
$code = $_GET["code"];
$db = new MYSQLi("localhost","root","","0710_info");
$sql = "delete from fruit where ids='{$code}'";
if($db->query($sql)){
    header("location:del_page.php");
}else{
    echo "刪除失敗!";
}  

第三步:實現對資料庫中數據的修改功能(與主界面連接)

代碼如下 :

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>修改功能</title>
        <script src="bootstrap/js/jquery-1.11.2.min.js"></script>
        <script src="bootstrap/js/bootstrap.min.js"></script>
        <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    </head>
    <style>
    *{
        margin: 0px auto;
        padding: ;
    }
    .input-group{
        margin-top: 15px;
    }
    .sub{
        margin: 20px 260px 10px;
    }
    </style>
    
    <body>
        <div style="height: 100px;"></div>
        <?php
        $code = $_GET["code"];
        $db = new MYSQLi("localhost","root","","0710_info");
        $sql = "select * from fruit where ids='{$code}'";
        $result = $db->query($sql);
        $arr = $result->fetch_row();    
        ?>
        <form action="update_processpage.php" method="post">
            <div class="panel panel-default" style="max-width: 600px;">
                <div class="panel-heading">
                    修改數據
                </div>
            <div class="panel-body">    
                     <div class="input-group">
                        <span class="input-group-addon">代號</span>
                        <input type="text" class="form-control" readonly="readonly" placeholder="請輸入代號" name="code" value="<?php echo $arr[0] ?>">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">名稱</span>
                        <input type="text" class="form-control" placeholder="請輸入名稱" name="name" value="<?php echo $arr[1] ?>">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">價格</span>
                        <input type="text" class="form-control" placeholder="請輸入價格" name="price" value="<?php echo $arr[2] ?>">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">產地</span>
                        <input type="text" class="form-control" placeholder="請輸入產地" name="chandi" value="<?php echo $arr[3] ?>">
                    </div>
                    <div class="input-group">
                        <span class="input-group-addon">庫存</span>
                        <input type="text" class="form-control" placeholder="請輸入庫存" name="kucun" value="<?php echo $arr[4] ?>">
                    </div>        
                <button type="submit" class="btn btn-primary sub">提交</button>
               </div>
     </div>                 
        </form>
    </body>
</html>

update(修改處理頁面)

<?php
$code = $_POST["code"];
$name= $_POST["name"];
$price = $_POST["price"];
$chandi = $_POST["chandi"];
$kucun = $_POST["kucun"];

$db = new MYSQLi("localhost","root","","0710_info");
$sql = "update fruit set
name='{$name}',price={$price},source='{$chandi}',numbers={$kucun} where ids='{$code}'";

if($db->query($sql)){
    header("location:del_page.php");
}else{
    echo "修改失敗!";
}

第四步:實現對資料庫中數據的批量選擇與刪除的功能(與主界面連接)

JS操作代碼如下:

 <script>
        function qx(qx){
            var ck = document.getElementsByClassName("ck");
            for(var i=0;i<ck.length;i++){        
            ck[i].checked=qx.checked;
        }
    }        
    </script>

PHP操作代碼如下:

<?php
$arr= $_POST["sub"];
require_once "./DBDA.class.php";//載入類進入操作界面
$db = new DBDA();
$str = implode("','", $arr);
$sql = "delete from fruit where ids in ('{$str}')";
if($db->query($sql,1)){
    header("location:del_page.php");
}else{
    echo "刪除失敗!";
}

***這裡進行了數據訪問類的封裝操作(優化使用)

PHP代碼如下:

<?php
class DBDA{
    public $host="localhost";
    public $uid="root";
    public $pwd="";
    public $dbname="0710_info";
    /*
        query方法:執行用戶給的sql語句,並返回相應的結果
        $sql:用戶需要執行的sql語句
        $type:用戶需要執行的sql語句的類型
        return:如果是增刪語句改返回true或false,如果是查詢語句返回二維數組
     */
    public function query($sql,$type=1){//預設true為增刪改
        $db = new MySQLi($this->host,$this->uid,$this->pwd,$this->dbname);
        if(mysqli_connect_error()){
            return "連接失敗!";    
        }
        $result = $db->query($sql);
        if($type==1){
            return $result;//增刪改語句返回true或false
        }else{
            return $result->fetch_all();//查詢語句返回二維數組
        }    
    }
}


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 參照及推薦博客:伍華聰 http://www.cnblogs.com/wuhuacong/archive/2009/07/07/1518346.html http://www.cnblogs.com/wuhuacong/p/3560685.html 這篇文章介紹了作者軟體的開發及成長歷程,作者在十幾 ...
  • 從網上搜索一大堆,套路幾乎相同,但自己就是不行,怎麼也不行,為什麼不行呢?不行的話別人肯定不來坑博友了呀。然後放了一會,去拿下午茶回來,再次來看,恍然大悟,What?這麼簡單。 一開始代碼如下: helper.GetConnectionString(schoolStr);//獲取當前連接字元串 us ...
  • ggplot2是用於繪圖的R語言擴展包。圖形組件通過“+”符號, 以圖層(layer)的方式來完成圖形語法疊加,構成最終的繪圖, 每個圖層中的圖形組件可以分別設定數據、映射或其他相關參數, 因此組件之間具有相對獨立性的,可以單獨對圖層進行修改。 一、ggplot2基本語法 表示映射數據的標度。aes ...
  • 在第一篇和第二篇文章中寫的編寫Django視圖時,使用的都是基於函數的方法,並且每個視圖函數之前都會加一個django-rest-framework帶的裝飾器@api_view。然後在第三篇文章,我們就開始把基於函數的視圖改成了基於類的視圖,然後發現這樣做視圖部分減少了很多代碼量。 在這一篇文章中,... ...
  • 怎麼學習Java,這是很多新手經常會問我的問題,現在我簡單描述下一個Java初學者到就業要學到的一些東西: 首先要明白Java體系設計到得三個方面:J2SE,J2EE,J2ME(KJAVA)。J2SE,Java 2 Platform Standard Edition,我們經常說到的JDK,就主要指的 ...
  • 一、字元編碼簡史: 美國:1963年 ASCII (包含127個字元 占1個位元組) 中國:1980年 GB2312 (收錄7445個漢字,包括6763個漢字和682個其它符號) 1993年 GB13000 (收錄20902個漢字) 1995年 GBK1.0 (收錄 21003個漢字) 2000年 G ...
  • jsp的C標簽一般使用方法以及js接收servlet中的對象及對象數組 由於現流行的javaWeb框架提倡前後端分離,比如在SpringMvc中已經很少寫servlet的一些東西;目前 前端jsp中大多是一些純html和js,很少用到jstl的一堆東西,後端也僅僅處理一些前端的post、get請求或 ...
  • 問題描述 小明開了一家糖果店。他別出心裁:把水果糖包成4顆一包和7顆一包的兩種。糖果不能拆包賣。 小朋友來買糖的時候,他就用這兩種包裝來組合。當然有些糖果數目是無法組合出來的,比如要買 10 顆糖。 你可以用電腦測試一下,在這種包裝情況下,最大不能買到的數量是17。大於17的任何數字都可以用4和7 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...