PHP 分页功能，用户信息表的编辑与删除功能

1、分页功能的实现

1.1 连接数据库

<?php
$pdo = new PDO('mysql:host=localhost;dbname=php.edu', 'root', '61187118');
// 设置结果默认获取方式: 关联数组
$pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_ASSOC);

1.2 获取分页数据：每页显示的数量，计算总页数

<?php
// 连接数据库
require 'connecter.php';
// 1. 每页显示10条数
$num = 10;
// 2. 当前页码,默认为1
$page = $_GET['p'] ?? 1;
// 3. 计算每一页的第一条记录的显示偏移量
$offset = ($page - 1) * $num;
// 4. 获取分页数据
$sql = "SELECT * FROM `users` LIMIT {$num} OFFSET {$offset}";
// 简写
$users = $pdo->query($sql)->fetchAll();
// 总页数 =  ceil(记录总数 / 每页的记录数)
$sql = "SELECT CEIL(COUNT(`id`)/{$num})  AS `total` FROM `users`";
// 计算总页数
$pages = $pdo->query($sql)->fetch()['total'];

1.3 用户信息表数据展示

<?php require 'page-data.php' 
    // 获取分页数据PHP文件?>
<!DOCTYPE html>
<html lang="en">
<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>
    <table>
        <caption>用户信息表</caption>
        <thead>
            <tr>
                <td>id</td>
                <td>name</td>
                <td>email</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <?php foreach ($users as $user):?>
                <tr>
                     <!-- 短标签来简化变量的显示 -->
                    <td><?=$user['id']?></td>
                    <td><?php echo $user['name'] ?></td>
                    <td><?=$user['email']?></td>
                    <td><button>编辑</button><button>删除</button></td>
                </tr>
            <?php endforeach ?>
        </tbody>
    </table>
</body>
</html>

1.4 信息表样式（css样式）

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  color: #555;
}
body {
  display: flex;
  flex-direction: column;
  align-items: center;
}
/*表格样式*/
table {
  width: 80%;
  border: 1px solid;
  border-collapse: collapse;
  text-align: center;
}
table caption {
  font-size: 1.2rem;
  margin: 10px;
}
table td,
table th {
  border: 1px solid;
  padding: 5px;
}
table tr:hover {
  background-color: #eee;
}
table thead tr:only-of-type {
  background-color: lightblue;
}
table button {
  width: 56px;
  height: 26px;
}
table button:last-of-type {
  color: red;
}
table button {
  cursor: pointer;
  margin: 0 3px;
}
/*分页条样式*/
body > p {
  display: flex;
}
p > a {
  text-decoration: none;
  color: #555;
  border: 1px solid;
  padding: 5px 10px;
  margin: 10px 2px;
}
.active {
  background-color: red;
  color: white;
  border: 1px solid red;
}

1.5 数据展示并做简单的分页（分页页面）

<?php require 'page-data.php' ?>
<!DOCTYPE html>
<html lang="en">
<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>
    <table>
        <caption>用户信息表</caption>
        <thead>
            <tr>
                <td>id</td>
                <td>name</td>
                <td>email</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <?php foreach ($users as $user):?>
                <tr>
                     <!-- 短标签来简化变量的显示 -->
                    <td><?=$user['id']?></td>
                    <td><?php echo $user['name'] ?></td>
                    <td><?=$user['email']?></td>
                    <td><button>编辑</button><button>删除</button></td>
                </tr>
            <?php endforeach ?>
        </tbody>
    </table>
    <p>
        <!-- 1. 分页条的动态生成
        2. 跳转地址的动态生成
        3. 当前页码的高亮显示 -->
        <!-- 分页条中的页码应该动态生成 -->
        <?php for ($i = 1; $i <= $pages; $i++): ?>
            <?php
                $jump = sprintf('%s?p=%s',$_SERVER['PHP_SELF'], $i);
                // $i: 分页中的页码
                // $page: 在URL中通过GET获取的页码?p=X
                // 把active值变量化，判断高亮，空不亮，当前页和url的页一样时就显示高亮
                $active = ($i == $page) ? 'active' : null;
            ?>
        <a href="<?=$jump?>" class="<?=$active?>"><?=$i?></a>
        <?php endfor ?>
    </p>
</body>
</html>

2、用户信息表的编辑与删除功能

2.1 建立一个编辑页面PHP文件

<?php
// 获取要被编辑的数据
$user = $pdo->query("SELECT * FROM `users` WHERE `id`={$id}")->fetch();
// print_r($user);
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户编辑</title>
</head>
<body>
    <h3>用户编辑</h3>
    <!-- 用户编辑完成后，做一个跳转 -->
    <form action="<? echo $_SERVER['PHP_SELF']. '?action=doedit&id='.$id?>" method="POST">
        <p>
            <label for="name">用户名:</label>
            <input type="text" name="name" id="name" value="<?=$user['name']?>">
        </p>
        <p>
            <label for="email">邮箱:</label>
            <input type="email" name="email" id="email" value="<?=$user['email']?>">
        </p>
        <p>
            <button>保存</button>
        </p>
    </form>
</body>
</html>

2.2 获取操作,并执行编辑与删除

<?php
require 'connect.php';
// 获取操作
$action = $_GET['action'];
$id = $_GET['id'];
switch ($action) {
    // 编辑操作： 1: 渲染编辑表单; 2. 执行编辑操作
    // 1: 渲染编辑表单
    case 'edit':
        // 加载,渲染数据编辑表单
        include 'edit.php';
    break;
    // 2. 执行编辑操作
    case 'doedit':
        // 更新
        $sql = 'UPDATE `users` SET `name`=?, `email`=? WHERE `id`=?';
        $stmt = $pdo->prepare($sql);
        // 新的数据在$_POST
        if (!empty($_POST)) {
        // 用户编辑完成后，做一个跳转，获取数据，execute方法传参
            $stmt->execute([$_POST['name'], $_POST['email'], $id]);
            if ($stmt->rowCount() == 1) echo '<script>alert("更新成功");location.href="demo2.php"</script>';
        }
    break;
    // 删除,配合demo2.php
    case 'delete':
        $sql = "DELETE FROM `users` WHERE `id`=?";
        $stmt = $pdo->prepare($sql);
        $stmt->execute([$id]);
        if ($stmt->rowCount() == 1) 
        {
            echo "<script>alert('删除成功');location.href='demo2.php'</script>";
        }
    break;
}

2.3 用户信息表数据展示，实现编辑与删除

<?php require 'page-data.php' ?>
<!DOCTYPE html>
<html lang="en">
<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>
    <table>
        <caption>用户信息表</caption>
        <thead>
            <tr>
                <td>id</td>
                <td>name</td>
                <td>email</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <?php foreach ($users as $user):?>
                <tr>
                     <!-- 短标签来简化变量的显示 -->
                    <td><?=$user['id']?></td>
                    <td><?php echo $user['name'] ?></td>
                    <td><?=$user['email']?></td>
                    <td>
                        <button onclick="location.href='handle.php?action=edit&id=<?=$user['id']?>'">编辑</button>
                    <button onclick="del(<?=$user['id']?>)">删除</button></td>
                </tr>
            <?php endforeach ?>
        </tbody>
    </table>
    <p>
        <!-- 1. 分页条的动态生成
        2. 跳转地址的动态生成
        3. 当前页码的高亮显示 -->
        <!-- 分页条中的页码应该动态生成 -->
        <!-- 继续完善分页功能
        1. 首页
        2. 尾页
        3. 上一页
        4. 下一页 -->
        <!-- 上一页: 解决页码的越界 -->
        <?php
        // 获取上一页的页码
        $prev = $page -1;
        // 解决越界问题
        if ($page == 1) $prev =1;
        ?>
        <?php if ($page != 1): ?>
             <!-- 首页 -->
        <a href="<?=$_SERVER['PHP_SELF'].'?p=1'?>">首页</a>
        <a href="<?=$_SERVER['PHP_SELF'].'?p='.$prev?>">上一页</a>
        <?php endif ?>
        <?php for ($i = 1; $i <= $pages; $i++): ?>
            <?php
                $jump = sprintf('%s?p=%s',$_SERVER['PHP_SELF'], $i);
                // $i: 分页中的页码
                // $page: 在URL中通过GET获取的页码?p=X
                $active = ($i == $page) ? 'active' : null;
            ?>
        <a href="<?=$jump?>" class="<?=$active?>"><?=$i?></a>
        <?php endfor ?>
          <!-- 下一页: 解决页码的越界 -->
          <?php
        // 获取下一页的页码
        $next = $page + 1;
        if ($next >= $pages) $next = $pages;
        ?>
        <?php if ($page != $pages) :?>
            <a href="<?=$_SERVER['PHP_SELF'].'?p='.$next ?>">下一页</a>
            <!-- 尾页，当前页，也就是pages -->
            <a href="<?=$_SERVER['PHP_SELF'].'?p='.$pages?>">尾页</a>
            <?php endif ?>
    </p>
    <script>
        // 删除，配合handle.php
        function del(id) {
            var isDelete = confirm('确定删除？')
            if (isDelete) {
                location.href = 'handle.php?action=delete&id='+id;
            }else{
                return false;
            }
        }
    </script>
</body>
</html>

总结

把分页样式封装成分页函数，列表页调用；

1、分页功能的实现

1.1 连接数据库

1.2 获取分页数据：每页显示的数量，计算总页数

1.3 用户信息表数据展示

1.4 信息表样式（css样式）

1.5 数据展示并做简单的分页（分页页面）

2、用户信息表的编辑与删除功能

2.1 建立一个编辑页面PHP文件

2.2 获取操作,并执行编辑与删除

2.3 用户信息表数据展示，实现编辑与删除

总结

相关文章