Blogger Information
Blog 47
fans 1
comment 0
visits 52941
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
PHP - 实现分页以及数据删改 实例
晴天
Original
790 people have browsed it

分页原理

1. 术语

  • 记录索引:
  • 偏移量:
  • 显示数量
  1. // 第一页
  2. SELECT * FROM `staffs` LIMIT 5 OFFSET 0;
  3. // 第二页
  4. SELECT * FROM `staffs` LIMIT 5 OFFSET 0;
  5. 第一页索引: 0 - 4
  6. 第二页索引: 5 - 9
  7. 第三页索引: 10 - 14
  8. 偏移量 = 每页显示的数量 * (当前页数 - 1)
  9. 第一页: 5 * (1 - 1) = 0
  10. 第二页: 5 * (2 - 1) = 5
  11. 第三页: 5 * (3 - 1) = 10
  12. ...

演示代码

演示地址 http://php.rc238.cn/0512/

index.php

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>员工管理系统</title>
  7. <link rel="stylesheet" href="style.css" />
  8. </head>
  9. <body>
  10. <table>
  11. <caption>
  12. 员工管理系统
  13. </caption>
  14. <thead>
  15. <tr>
  16. <th>ID</th>
  17. <th>姓名</th>
  18. <th>年龄</th>
  19. <th>性别</th>
  20. <th>职位</th>
  21. <th>手机</th>
  22. <th>入职时间</th>
  23. <th>操作</th>
  24. </tr>
  25. </thead>
  26. <tbody>
  27. <?php
  28. require 'demo1.php';
  29. foreach ($staffs as $staff){
  30. // 数组转名值对
  31. extract($staff);
  32. /* @var string $id;
  33. * @var string $name;
  34. * @var string $age;
  35. * @var string $sex;
  36. * @var string $position;
  37. * @var string $mobile;
  38. * @var string $hiredate;
  39. * */
  40. $sex = $sex ? '男' : '女';
  41. $hiredate = date('Y / m / d',$hiredate);
  42. echo <<<AAA
  43. <tr>
  44. <td>{$id}</td>
  45. <td>{$name}</td>
  46. <td>{$age}</td>
  47. <td>{$sex}</td>
  48. <td>{$position}</td>
  49. <td>{$mobile}</td>
  50. <td>{$hiredate}</td>
  51. <td><a href="update.php?p={$page}&update_id={$id}">编辑</a><a href="delect.php?p={$page}&delect_id={$id}">删除</a></td>
  52. </tr>
  53. AAA;
  54. }
  55. //删除数据
  56. ?>
  57. </tbody>
  58. </table>
  59. <div>
  60. <?php
  61. // 判断是不是第一页
  62. if ($page > 1){
  63. echo "<a href='?p=1' class='headtail'>首页</a>";
  64. $start = $page-1;
  65. echo "<a href='?p={$start}' class='around'>上一页</a>";
  66. }
  67. //创建输出方法
  68. function Output($i){
  69. global $page;
  70. $jump = sprintf('?p=%s',$i);
  71. $active = ($i==$page)?'active':null;
  72. echo "<a href='{$jump}' class='{$active}'>{$i}</a>";
  73. }
  74. // 输出前两条
  75. for ($i=1;$i<=2;$i++){
  76. Output($i);
  77. }
  78. // 判断输出 ...
  79. if ($page > 5){
  80. echo "<span > ... </span>";
  81. }
  82. // 输出前后页数
  83. // 当前页小于五输出1234567
  84. if ($page <= 5 ){
  85. for ($i=3;$i<=7;$i++){
  86. Output($i);
  87. }
  88. }
  89. // 当前页大于5和小于总页数-4 输出当前页前2加厚2
  90. if ($page >5 && $page < $pages-4){
  91. for ($i=($page-2);$i<=$page+2;$i++){
  92. Output($i);
  93. }
  94. }
  95. // 当前页大于总页数-4 输出后面全部页数
  96. if ($page>=$pages-4){
  97. for ($i=$pages-4;$i<=$pages;$i++){
  98. Output($i);
  99. }
  100. }
  101. // 判断输出
  102. if ($page<$pages-4){
  103. echo "<span > ... </span>";
  104. }
  105. //尾部
  106. if ($page<=$pages-5 ) {
  107. for ($i = ($pages - 1); $i <= $pages; $i++) {
  108. Output($i);
  109. }
  110. }
  111. if ($page < $pages ){
  112. $next = $page+1;
  113. echo "<a href='?p={$next}' class='around'>下一页</a>";
  114. echo "<a href='?p={$pages}'class='headtail'>尾页</a>";
  115. }
  116. if ($pages > 10 ){
  117. echo <<<bbb
  118. <form class="form1" action="" method="get">
  119. <input type="number" name="p"min="1" max=" {$pages}" required />
  120. <button>跳转</button>
  121. </form>
  122. bbb;
  123. }
  124. ?></div>
  125. </body>
  126. </html>

demo1.php

  1. <?php
  2. //连接数据库
  3. require 'connect.php';
  4. ////非法请求
  5. $err = "<script>alert('非法请求');location.href='index.php';</script>";
  6. //当前页码
  7. $page = $_GET['p'] ?? 1 ;
  8. if ($page<=0){
  9. die($err);
  10. }
  11. //每页记录数量
  12. $num = 12;
  13. //获取总页数
  14. $sql = "SELECT CEIL(COUNT(`id`)/{$num}) AS `total` FROM `staffs`";
  15. $pages = $pdo->query($sql)->fetch()['total'];
  16. if ($page>$pages){
  17. die($err);
  18. }
  19. //偏移量
  20. $offset = $num*($page-1);
  21. //分页的数据
  22. $sql = "SELECT * FROM `staffs` LIMIT {$num} OFFSET {$offset}";
  23. $staffs = $pdo->query($sql)->fetchAll();

connect.php

  1. <?php
  2. $dsn = 'mysql:host=localhost;dbname=php11.edu';
  3. $username = 'php11.edu';
  4. $password = 'php11.edu';
  5. try {
  6. $pdo = new PDO($dsn,$username,$password);
  7. $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE,PDO::FETCH_ASSOC);
  8. }catch (Exception $e){
  9. die($e->getMessage());
  10. }

delect.php

  1. <?php
  2. //链接数据库
  3. require 'connect.php';
  4. //获取返回页码
  5. $page = 'index.php?p='.$_GET['p'];
  6. //获取删除id
  7. $delect_id = [$_GET['delect_id']];
  8. //创建sql语句
  9. $sql = 'DELETE FROM `staffs` WHERE `id`=?';
  10. //执行删除
  11. $stmt = $pdo->prepare($sql);
  12. $stmt->execute($delect_id);
  13. //判断是否删除成功
  14. if ($stmt->rowCount() === 1){
  15. echo "<script>alert('删除成功:id={$_GET['delect_id']}');location.href='{$page}'</script>";
  16. }else{
  17. echo "<script>alert('删除失败');location.href='{$page}'</script>";
  18. }

update.php

  1. <?php
  2. //更新修改数据库
  3. //链接数据库
  4. require 'connect.php';
  5. //获取id
  6. $update_id = $_GET['update_id'];
  7. //获取页数
  8. $page = $_GET['p'];
  9. //先查询到信息显示
  10. $sql = "SELECT * FROM `staffs` WHERE `id`={$update_id}";
  11. $user = $pdo->query($sql)->fetch(PDO::FETCH_ASSOC);
  12. extract($user);
  13. /**
  14. * @var string $id;
  15. * @var string $name;
  16. * @var string $age;
  17. * @var string $sex;
  18. * @var string $position;
  19. * @var string $mobile;
  20. * @var string $hiredate;
  21. **/
  22. $sex = $sex ? '男': '女';
  23. $date = date('Y / m / d' ,$hiredate);
  24. echo <<< aa
  25. <style>
  26. @import "style.css";
  27. </style>
  28. <form class="update" action="update1.php" method="post">
  29. <div>
  30. <label for="id">ID:</label>
  31. <input type="text" id="id" disabled value="{$id}" />
  32. </div>
  33. <div>
  34. <label for="name">姓名:</label>
  35. <input type="text" id="name" name="name" required value="{$name}" />
  36. </div>
  37. <div>
  38. <label for="age">年龄:</label>
  39. <input type="number" max="99" min="18" id="age" name="age" required value="{$age}" />
  40. </div>
  41. <div>
  42. <label for="sex">性别:</label>
  43. <input type="text" id="sex" disabled value="{$sex}" />
  44. </div>
  45. <div>
  46. <label for="position">职位:</label>
  47. <input type="text" id="position" name="position" required value="{$position}" />
  48. </div>
  49. <div>
  50. <label for="mobile">手机号:</label>
  51. <input
  52. type="text"
  53. id="mobile"
  54. name="mobile"
  55. required
  56. minlength="11"
  57. maxlength="11"
  58. value="{$mobile}"
  59. />
  60. </div>
  61. <div>
  62. <label for="hiredate">入职时间:</label>
  63. <input type="text" id="hiredate" disabled value="{$date}" />
  64. </div>
  65. <input type="hidden" name="p" value="{$page}">
  66. <button name="id" value="{$id}">提交</button>
  67. </form>
  68. aa;

update1.php

  1. <?php
  2. require 'connect.php';
  3. //获取值
  4. $page = $_POST['p'];
  5. $id = $_POST['id'];
  6. $name = $_POST['name'];
  7. $age = $_POST['age'];
  8. $position = $_POST['position'];
  9. $mobile = $_POST['mobile'];
  10. //执行更新
  11. $sql = "UPDATE `staffs` SET `name` = '{$name}' ,`age` = '{$age}' , `position` = '{$position}',`mobile` = '{$mobile}' WHERE `id` = {$id}";
  12. $stmt = $pdo->prepare($sql);
  13. $stmt->execute();
  14. //判断是否执行成功
  15. if ($stmt->rowCount()===1){
  16. echo "<script>alert('修改成功');location.href='index.php?p={$page}'</script>";
  17. }else{
  18. if ($stmt->errorInfo()[0] == 00000){
  19. echo "<script>alert('没有值被修改');location.href='index.php?p={$page}'</script>";
  20. }else{
  21. echo "<script>alert('修改失败');location.href='index.php?p={$page}'</script>";
  22. }
  23. }

style.css

  1. * {
  2. margin: 0px;
  3. padding: 0px;
  4. box-sizing: border-box;
  5. color: #555;
  6. }
  7. body {
  8. display: flex;
  9. flex-direction: column;
  10. align-items: center;
  11. }
  12. table {
  13. width: 1000px;
  14. border: 1px solid;
  15. text-align: center;
  16. border-collapse: collapse;
  17. }
  18. table > caption {
  19. font-size: 1.2rem;
  20. margin: 10px;
  21. }
  22. table td,
  23. table th {
  24. border: 1px solid;
  25. padding: 5px;
  26. }
  27. table tr:hover {
  28. background-color: #eee;
  29. }
  30. div {
  31. display: flex;
  32. flex-flow: row nowrap;
  33. align-items: center;
  34. }
  35. div > a {
  36. padding: 5px;
  37. border: 1px solid;
  38. margin: 10px;
  39. width: 30px;
  40. height: 30px;
  41. text-decoration: none;
  42. text-align: center;
  43. }
  44. div > a:hover {
  45. background-color: violet;
  46. color: #fff;
  47. }
  48. .headtail {
  49. width: 50px;
  50. }
  51. .around {
  52. width: 80px;
  53. }
  54. .active {
  55. background-color: lightskyblue;
  56. color: linen;
  57. }
  58. .form1 > input {
  59. width: 50px;
  60. height: 30px;
  61. }
  62. .form1 > input:out-of-range,
  63. .form1 > input::-webkit-inner-spin-button {
  64. appearance: none;
  65. }
  66. .update {
  67. display: flex;
  68. flex-flow: column;
  69. margin: 30px auto;
  70. }
  71. .update > div {
  72. width: 220px;
  73. margin-bottom: 10px;
  74. display: flex;
  75. justify-content: space-between;
  76. }
  77. tbody a {
  78. text-decoration: none;
  79. margin: 0px 10px;
  80. background-color: lightskyblue;
  81. padding: 3px 10px;
  82. color: #fff;
  83. border: none;
  84. border-radius: 5px;
  85. }
  86. tbody a:hover {
  87. background-color: aqua;
  88. }

总结

感觉这个方法太笨了,总算能够实现功能,一定有更优美的方式实现

Correcting teacher:天蓬老师天蓬老师

Correction status:qualified

Teacher's comments:这个案例今晚会讲, 你看一下不一样的实现方案
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post