search

博客列表 >PHP原生态！控制+模型+列表渲染+算法分页，啥也不说了，自己看吧…

PHP原生态！控制+模型+列表渲染+算法分页，啥也不说了，自己看吧…

张福根一修品牌运营
张福根一修品牌运营原创
2020年12月13日 16:03:312190浏览

数据编辑与PHP实现带省略标志的算法分页

效果展示：

数据编辑与PHP实现带省略标志的算法分页

一、数据编辑与删除

1、定义数据库（databases.php）

  1. <?php
  2. namespace zhangfugen;
  3. return [
  4.     'type' => $type ?? 'mysql',
  5.     'host' => $host ?? 'localhost',
  6.     'dbname' => $dbname ?? 'apple',
  7.     'port' => $port ?? '3306',
  8.     'charset' => $charset ?? 'utf8',
  9.     'username' => $username ?? 'root',
  10.     'password' => $password ?? '123456'
  11. ];

2、连接数据库（connect.php）

  1. <?php
  2. namespace zhangfugen2;
  3. $config = require __DIR__ . '/database.php';
  4. use PDO;
  5. //PDO数据连接~三要素 DSN数据源 username password,
  6. extract($config);
  7. $dsn = sprintf('%s:host=%s;dbname=%s',$type,$host,$dbname);
  9. try {
  10.     $pdo = new PDO($dsn,$username ,$password,[PDO::ATTR_ERRMODE=> PDO::ERRMODE_WARNING]);
  11.     // var_dump($pdo);
  12.     //设置结果集的默认获取方式,只获取关联数组部分
  13.     $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE,PDO::FETCH_ASSOC);
  14. } catch(\Exception $e) {
  15.     die('Connection error: '. $e->getMessage());
  16. }

3、获取分页数据(userdata.php)

  1. //获取分页数据
  3. // 定义每页显示的数量
  4. $num = 10;
  6. //当前页码,默认为1
  7. $page = $_GET['p'] ?? 1;
  9. //计算偏移量(偏移量 = (页码 -1) \* 每页的显示数量)
  10. $offset = ($page - 1) * $num ;
  12. //获取分页数据
  13. $sql = " SELECT `id`,`uname`,`age`,`type`,`skill` FROM `users` ORDER BY `id` ASC  LIMIT {$num} OFFSET {$offset} ";
  14. $users = $pdo->query($sql)->fetchAll();
  16. //获取总页数，ceil() 函数向上舍入为最接近的整数
  17. $sql = "SELECT CEIL(COUNT(`id`)/{$num}) AS `total` FROM `users`";
  18. $pages = $pdo->query($sql)->fetch()['total'];

4、控制分发器:编辑+删除（userhandle.php）

  1. <?php
  2. require 'connect.php';
  3. //获取get参数
  4. $action = $_GET['action'];
  5. $id = $_GET['id'];
  6. switch(strtolower($action)):
  7.     //编辑操作 :1.渲染编辑表单 
  8.     // 1.渲染编辑表单
  9.     case 'edit':
  10.         require 'useredit.php';
  11.     break;
  12.     //2.执行编辑操作
  13.     case 'doedit':
  14.     //更新数据表数据
  15.     $sql = 'UPDATE `users` SET `uname`= ?, `age` = ?, `type` = ?, `skill` = ? WHERE `id` =?;';
  16.     $stmt = $pdo->prepare($sql);
  17.     $stmt->execute([$_POST['uname'],$_POST['age'],$_POST['type'],$_POST['skill'],$id]);
  18.     if($stmt->rowCount() == 1) echo '<script>alert("更新成功");location.href = "userlist2.php"</script>';
  19.     break;
  20.     // 删除
  21.     case 'delete':
  22.         $sql = 'DELETE FROM `users`  WHERE `id`=?';
  23.         $stmt = $pdo->prepare($sql);
  24.         $stmt->execute([$id]);
  25.         if ($stmt->rowCount() == 1) echo '<script>alert("删除成功");location.href="userlist2.php"</script>';
  26.     default:
  27.         die('非法操作');
  28.     break;
  29. endswitch;

5、用户编辑页（useredit.php）

效果展示：

用户编辑页

源码分享：

  1. <?php
  2. //获取要被编辑的某条数据
  4. $user = $pdo->query(" SELECT * FROM `users` WHERE `id` = {$id}")->fetch();
  5. // print_r($user);
  6. ?>
  7. <!DOCTYPE html>
  8. <html lang="en">
  10. <head>
  11.     <meta charset="UTF-8">
  12.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  13.     <title>用户编辑</title>
  14.     <link rel="stylesheet" href="editstyle.css">
  15. </head>
  17. <body>
  18.     <h3>用户编辑</h3>
  19.     <form action="<? echo $_SERVER['PHP_SELF'].'?action=doedit&id='.$id ?>" method="POST">
  20.         <p>
  21.             <label for="uname">名&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称</label>
  22.             <input type="text" id="uname" name="uname" value="<?=$user['uname']?>">
  23.         </p>
  24.         <p>
  25.             <label for="age">年&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;龄</label>
  26.             <input type="number" name="age" id="age" value="<?=$user['age']?>">
  27.         </p>
  28.         <p>
  29.             <label for="type">工&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;种</label>
  30.             <input type="text" name="type" id="type" value="<?=$user['type']?>">
  31.         </p>
  32.         <p>
  33.             <label for="skill">擅长技能</label>
  34.             <input type="text" name="skill" id="skill" value="<?=$user['skill']?>">
  35.         </p>
  36.         <p>
  37.             <button>保存</button>
  38.         </p>
  39.     </form>
  40. </body>
  41. </html>

编辑页CSS(editstyle.css)

  1. * {
  2.   margin: 0;
  3.   padding: 0;
  4.   box-sizing: border-box;
  5.   color: #555;
  6. }
  7. body {
  8.   display: flex;
  9.   flex-direction: column;
  10.   align-items: center;
  11.   background-color: #e8f4f8;
  12. }
  13. /*表单样式*/
  14. form {
  15.   width: 400px;
  16.   border-collapse: collapse;
  17.   text-align: center;
  18.   background-color: lightblue;
  19.   padding: 20px;
  20. }
  21. h3 {
  22.   font-size: 1.3rem;
  23.   margin: 10px;
  24. }
  25. form p {
  26.   padding: 7px;
  27.   font-size: 0.8rem;
  28. }
  29. label,
  30. input {
  31.   padding: 2px;
  32.   font-size: 0.9rem;
  33.   line-height: 25px;
  34. }
  35. button {
  36.   width: 250px;
  37.   padding: 7px;
  38. }

二、数据列表页面（userlist2.php）

算法分页实现原理:1.首页,2.尾页,3.上一页,4.下一页,5.省略 等功能

  1. <?php
  2. require 'userdata.php';
  3. ?>
  4. <!DOCTYPE html>
  5. <html lang="en">
  7. <head>
  8.     <meta charset="UTF-8">
  9.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  10.     <title>【久益一修】装修工人信息表</title>
  11.     <link rel="stylesheet" href="userstyle.css">
  12. </head>
  14. <body>
  15.     <table>
  16.         <caption>【久益一修】装修工人信息表</caption>
  17.         <thead>
  18.             <tr>
  19.                 <td>编号</td>
  20.                 <td>姓名</td>
  21.                 <td>年龄</td>
  22.                 <td>工种</td>
  23.                 <td>擅长技能</td>
  24.                 <td>操作</td>
  25.             </tr>
  26.         </thead>
  27.         <tbody>
  28.             <?php foreach($users as $user):?>
  29.             <tr>
  30.                 <td><?= $user['id']?></td>
  31.                 <td><?= $user['uname']?></td>
  32.                 <td><?= $user['age']?></td>
  33.                 <td><?= $user['type']?></td>
  34.                 <td><?= $user['skill']?></td>
  35.                 <td>
  36.                     <button onclick="location.href='userhandle.php?action=edit&id=<?=$user['id']?>'">编辑</button>
  37.                     <button onclick="location.href='userhandle.php?action=delete&id=<?=$user['id']?>'">删除</button>
  38.                 </td>
  39.             </tr>
  40.             <?php endforeach;?>
  41.         </tbody>
  42.     </table>
  44. <!-- ======================================= -->
  46.     <?php
  47.      // 分页条显示的页数
  48.      $showPages =5;
  49.      // 分页条的起始页码值
  50.      $startPage = 1;
  51.      // 分页条的终止页码值
  52.      $endPage = $pages;
  53.      // 分页条的终止页码相对于当前页码的偏移量: 分页条显示的页数减1再除2
  54.      $offsetPage = ($showPages - 1) / 2;
  56.      // 只有当前分页条显示页码数量 < 总页数时, 才有必要显示出省略标志
  57.      if ($showPages < $pages) {
  58.          //如果当前页码大于偏移量加1, 应该显示省略标记
  59.          if ($page > $offsetPage + 1) {
  60.              $startOmit = '...';
  61.          }
  62.          // 如果当前页, 大于偏移量, 就需要重置一下新分页条的起止点页码
  63.          if ($page > $offsetPage) {
  64.              // 当前分页条的起始页码 = 当前页码 - 偏移量
  65.              $startPage = $page - $offsetPage;
  67.              // 当前分页条的结束页码 = 当前页码 + 偏移量
  68.              $endPage = $page + $offsetPage;
  70.              // 当前页码 + 偏移量, 有可能会大于总页数,所以要进行检测
  71.              if ($endPage > $pages) {$endPage = $pages;  }
  72.          } else {
  73.              // 如果当前页码 <  偏移量, 如当前是第2页,当前页码就等于偏移量
  74.              // 此时需要重新设置新分页条的起始页码
  75.              $startPage = 1;
  76.              //结束页码就等于显示页码数量
  77.              $endPage = $showPages;
  78.              }
  80.          // 如果当前页 + 偏移量 > 总页数
  81.          if ($page + $offsetPage > $pages) {
  82.              // 例如总页码10, 当前为9页, 则9+2>10, 此时需要向前面借位偏移,才能保证仍然显示为5个页码
  83.              // 此时, 新的起始位置 = 当前位置 - (当前页 + 偏移量 - 原来的结束位置)
  84.              $startPage = $page - $offsetPage-1  ;
  85.          }
  86.          // 只要当前显示的页码数量 < 总页数 并且 当前页+偏移量也小于总页数, 那就应该显示出后面的省略号
  87.          if ($showPages < $pages && $page + $offsetPage < $pages) $endOmit = '...';
  88.      }
  89.     ?>
  91. <!-- ======================================= -->
  93.     <p>
  94.         <!-- 首页-->
  95.         <a href="<?php echo $_SERVER['PHP_SELF'] . '?p=1' ?>">首页</a>
  96.         <!--防止向前越界-->
  97.         <?php $prev = $page - 1; if ($page == 1) { $prev = 1;} ?>
  98.         <a href="<?php echo $_SERVER['PHP_SELF'] . '?p=' . $prev ?>">上一页</a>
  99.         <!--省略标插入：在下一页的后面-->
  100.         <?php if (isset($startOmit)): ?><a href="javascript:;"><?php echo $startOmit ?></a><?php endif ?>
  102. <!-- ======================================= -->
  104.         <!-- 显示页码-->
  105.         <!--显示页码是变量:$startPage, 动态的与新分页条保持一致-->
  106.         <?php for ($i = $startPage; $i <= $endPage; $i++) : ?>
  107.         <!-- 当前页面高亮显示 -->
  108.         <?php $active = ($i == $page) ? 'active' : null;
  109.         // 跳转页码的地址
  110.         $jump = sprintf('%s?p=%s', $_SERVER['PHP_SELF'], $i);
  111.         ?>
  112.         <a href="<?php echo $jump ?>" class="<?php echo $active ?>"><?php echo $i ?></a>
  113.         <?php endfor; ?>
  115. <!-- ======================================= -->
  117.         <!--  下一页-->
  118.         <!-- 下一页=当前页+1，如果当前页=总页数，下一页=总页数 ，防止向后越界-->
  119.         <?php $next = $page + 1; if ($page == $pages) { $next = $pages; } ?>
  120.         <!--省略标记插入：在下一页的前面-->
  121.         <?php if (isset($endOmit)): ?><a href="javascript:;"><?php echo $endOmit ?></a><?php endif ?>
  122.         <a href="<?php echo $_SERVER['PHP_SELF'] . '?p=' . $next ?>">下一页</a>
  123.         <a href="<?php echo $_SERVER['PHP_SELF'] . '?p=' . $pages ?>">尾页</a>
  124.     </p>
  125. </body>
  127. </html>

列表页CSS(userstyle.css)

  1. * {
  2.   margin: 0;
  3.   padding: 0;
  4.   box-sizing: border-box;
  5.   color: #555;
  6. }
  8. body {
  9.   display: flex;
  10.   flex-direction: column;
  11.   align-items: center;
  12. }
  14. /*表格样式*/
  15. table {
  16.   width: 90%;
  17.   border: 1px solid;
  18.   border-collapse: collapse;
  19.   text-align: center;
  20. }
  22. table caption {
  23.   font-size: 1.3rem;
  24.   margin: 10px;
  25. }
  26. table td,
  27. table th {
  28.   border: 1px solid;
  29.   padding: 7px;
  30.   font-size: 0.9rem;
  31. }
  33. table tr:hover {
  34.   background-color: #eee;
  35. }
  37. table thead tr:only-of-type {
  38.   background-color: lightblue;
  39. }
  41. table button {
  42.   width: 56px;
  43.   height: 26px;
  44. }
  45. table button:last-of-type {
  46.   color: coral;
  47. }
  48. table button {
  49.   cursor: pointer;
  50.   margin: 0 3px;
  51. }
  52. /*分页条样式*/
  53. body > p {
  54.   display: flex;
  55. }
  57. p > a {
  58.   text-decoration: none;
  59.   color: #555;
  60.   border: 1px solid;
  61.   padding: 5px 10px;
  62.   margin: 10px 2px;
  63. }
  65. .active {
  66.   background-color: coral;
  67.   color: white;
  68.   border: 1px solid coral;
  69. }
上一条：iframe内联框架 && CSS基础下一条：VSCODE的安装以及插件安装，HTML中标题、超链接、内框架、图片标签
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多