首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能

Posted in PHP onMay 21, 2019

这个自己的小项目要先告一段落了。可能还有许多bug。请见谅 

删除学生功能

PHP:

// 这里是通过前端代码HTML中的 url 传过来的，用 $_GET 来获取(相关HTML代码可以看一下到主页看一下前几条博客)
if (empty($_GET['num'])) exit('<h1>找不到您要删除的学生的学号</h1>');
$num = $_GET['num'];
$connection = mysqli_connect('localhost', 'root', '密码', 'students_info_system');
if (!$connection) exit('<h1>连接数据库失败</h1>');
$query = mysqli_query($connection, "delete from students where num = {$num}");
if (!$query) exit('<h1>该学生信息查询失败</h1>');
// 注意：这里传入的是连接对象
$affected_rows = mysqli_affected_rows($connection);
if ($affected_rows !== 1) exit('<h1>删除失败</h1>');
header('Location: student_info.php');

编辑学生功能(整体上和添加学生功能差不到，稍微有些许变化)

HTML:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>编辑学生</title>
  <link rel="stylesheet" type="text/css" href="css/Bootstrap.css" rel="external nofollow" >
</head>
<body>
  <div class="container mt-3">
    <h1 class="display-5 text-center">编辑学生</h1>
    <?php if (isset($error_msg)): ?>
    <div class="alert alert-danger"><?php echo $error_msg; ?></div>
    <?php endif ?>
    <div class="row mt-3">
      <img src="<?php echo $current_student['photo']; ?>" alt="<?php echo $current_student['name']; ?>" width="100" height="488" class="col-sm-6">
      <form action="<?php echo $_SERVER['PHP_SELF']; ?>?id=<?php echo $current_num; ?>" method="post" enctype="multipart/form-data" autocomplete="off" class="col-sm-6">
        <div class="form-group">
          <input type="number" name="num" class="form-control" placeholder="学号" value="<?php echo isset($_POST['num']) ? $_POST['num'] : $current_student['num']; ?>">
        </div>
        <div class="form-group">
          <select class="form-control" name="system">
            <option>请选择学院/系</option>
            <option <?php echo $current_student['system'] === '电气工程学院' ? 'selected' : ''; ?>>电气工程学院</option>
            <option <?php echo $current_student['system'] === '信息工程与艺术学院' ? 'selected' : ''; ?>>信息工程与艺术学院</option>
            <option <?php echo $current_student['system'] === '国际教育学院' ? 'selected' : ''; ?>>国际教育学院</option>
            <option <?php echo $current_student['system'] === '水利水电工程学院' ? 'selected' : ''; ?>>水利水电工程学院</option>
            <option <?php echo $current_student['system'] === '测绘与市政工程学院' ? 'selected' : ''; ?>>测绘与市政工程学院</option>
            <option <?php echo $current_student['system'] === '马克思主义学院' ? 'selected' : ''; ?>>马克思主义学院</option>
            <option <?php echo $current_student['system'] === '建筑工程学院' ? 'selected' : ''; ?>>建筑工程学院</option>
            <option <?php echo $current_student['system'] === '经济与管理学院' ? 'selected' : ''; ?>>经济与管理学院</option>
          </select>
        </div>
        <div class="form-group">
          <input type="text" name="class" class="form-control" placeholder="班级" value="<?php echo isset($_POST['class']) ? $_POST['class'] : $current_student['class']; ?>">
        </div>
        <div class="form-group">
          <input type="text" name="name" class="form-control" placeholder="姓名" value="<?php echo isset($_POST['name']) ? $_POST['name'] : $current_student['name']; ?>">
        </div>
        <div class="form-group">
          <select class="form-control" name="gender">
            <option value="-1">请选择性别</option>
            <option <?php echo $current_student['gender'] === '1' ? 'selected' : ''; ?> value="1">男</option>
            <option <?php echo $current_student['gender'] === '0' ? 'selected' : ''; ?> value="0">女</option>
          </select>
        </div>
        <div class="form-group">
          <label for="birthday">出生日期</label>
          <input type="date" name="birthday" class="form-control" id="birthday" value="<?php echo isset($_POST['birthday']) ? $_POST['birthday'] : $current_student['birthday']; ?>">
        </div>
        <div class="form-group">
          <label for="photo">照片</label>
          <input type="file" name="photo" class="form-control">
        </div>
        <button type="submit" class="btn btn-info btn-block">确认修改</button>
      </form>
    </div>
  </div>
</body>
</html>

PHP:

if (empty($_GET['id'])) exit('<h1>必须指定相应的学号</h1>');
$current_num = $_GET['id'];
$connection = mysqli_connect('localhost', 'root', '密码', 'students_info_system');
if (!$connection) exit('<h1>连接数据库失败</h1>');
$query = mysqli_query($connection, "select * from students where num = {$current_num} limit 1");
if (!$query) exit('<h1>找不到您要编辑的学生信息</h1>');
$current_student = mysqli_fetch_assoc($query);
// var_dump($current_student);
function edit_student() {
  // var_dump('进来了');
  global $connection;
  global $current_num;  // 当前学生学号
  global $current_student;
  $extra_students_query = mysqli_query($connection, "select * from students where num != {$current_num}");
  if (!$extra_students_query) {
    exit('<h1>其余学生数据查询失败</h1>');
    // return;
  }
  // 查询除该学生以外的其他学生
  while ($student = mysqli_fetch_assoc($extra_students_query)) {
    // var_dump($student);
    $students_num[] = $student['num'];
  }
  // var_dump($students_num);
  // var_dump($_FILES['photo']);
  // var_dump($_POST['gender']);
  if (empty($_POST['num'])) {
    $GLOBALS['error_msg'] = '请输入学号';
    return;
  }
  // 判断该学号是否已经被添加(即列表中已存在该学生)=========
  if (in_array($_POST['num'], $students_num)) {
    $GLOBALS['error_msg'] = '该学生已存在';
    return;
  }
  if (empty($_POST['system']) || $_POST['system'] === '请选择学院/系') {
    $GLOBALS['error_msg'] = '请选择学院/系';
    return;
  }
  if (empty($_POST['class'])) {
    $GLOBALS['error_msg'] = '请输入班级';
    return;
  }
  if (empty($_POST['name'])) {
    $GLOBALS['error_msg'] = '请输入姓名';
    return;
  }
  if (!(isset($_POST['gender']) && $_POST['gender'] !== '-1')) {
    $GLOBALS['error_msg'] = '请选择性别';
    return;
  }
  if (empty($_POST['birthday'])) {
    $GLOBALS['error_msg'] = '请输入出生日期';
    return;
  }
  // 以下处理文件域=======================================================
  // 当有文件上传时才验证，没有上传则照片不变
  // $_FILES['photo'] = $current_student['photo'];
  // var_dump($_FILES['photo']);
  if ($_FILES['photo']['name'] !== '') {
    // var_dump($_FILES['photo']);
    // var_dump($_FILES['photo']);
    if ($_FILES['photo']['error'] !== UPLOAD_ERR_OK) {
      $GLOBALS['error_msg'] = '上传照片失败';
      return;
    }
    // 验证上传文件的类型(只允许图片)
    if (strpos($_FILES['photo']['type'], 'image/') !== 0) {
      $GLOBALS['error_msg'] = '这不是支持的文件格式类型，请重新上传';
      return;
    }
    // 文件上传到了服务端开辟的一个临时地址，需要转移到本地
    $image_target = 'images/' . $_FILES['photo']['name'];
    if (!move_uploaded_file($_FILES['photo']['tmp_name'], $image_target)) {
      $GLOBALS['error_msg'] = '图片上传失败';
      return;
    }
    // 接收更新过的学生照片
    $current_student['photo'] = (string)$image_target;
  } else {
    // var_dump($_FILES['photo']);
    // 如果照片没有上传则不进行验证文件域,直接更新数据且不改变原来的照片
    $current_student['num'] = $_POST['num'];
    $current_student['system'] = $_POST['system'];
    $current_student['class'] = $_POST['class'];
    $current_student['name'] = $_POST['name'];
    $current_student['gender'] = $_POST['gender'];
    $current_student['birthday'] = $_POST['birthday'];
  }
  // var_dump($current_num);
  // 将数据修改存放到数据库
  $update_query = mysqli_query($connection, "update students set `num` = '{$current_student['num']}', `system` = '{$current_student['system']}', `class` = '{$current_student['class']}', `name` = '{$current_student['name']}', `gender` = '{$current_student['gender']}', `birthday` = '{$current_student['birthday']}', `photo` = '{$current_student['photo']}' where `num` = {$current_num}");
  if (!$update_query) {
    $GLOBALS['error_msg'] = '更新数据查询失败';
    return;
  }
  $affected_rows = mysqli_affected_rows($connection);
  if ($affected_rows !== 1) {
    $GLOBALS['error_msg'] = '修改失败';
    return;
  }
  // 延迟2秒
  time_sleep_until(time() + 2);
  header('Location: student_info.php');
}
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  edit_student();
}

搜索功能（用js）

// 关键词搜索功能----立即函数
(function (element, search_key) {
  let table = document.getElementById('table-content'); // 获取表格
  function in_array_item (item, array) {
    for (var i = 0; i < array.length; i++) {
      if (array[i].indexOf(item) != -1) {
        return true;
      }
    }
    return false;
  }
  function response () {
    let hiddenStudentsNumber = 0;             // 获取隐藏的学生个数(即表格隐藏行数)
    // 获取要搜索的关键词
    const search_content = document.getElementById(search_key).value;
    // console.log(search_content);
    // console.log(typeof(search_content));
    let data = [];
    // 遍历列表将数据存储到一个数组中
    // 1.获取表格行数
    for (let i = 0; i < table.children.length; i++) {
      // 2.获取表格列数
      for (let j = 0; j < table.children[i].children.length; j++) {
        if (!data[i]) {
          // 在数组中创键每一行内容存放的数组，用于存放一行数据
          data[i] = new Array();
        }
        data[i][j] = table.children[i].children[j].innerHTML.toString();
        // 3.存放数据
        if (data[i][j] === '♂') {
          data[i][j] = '男';
        }
        if (data[i][j] === '♀') {
          data[i][j] = '女';
        }
      }
      // console.log(data[i]);
      if (search_content == '') {
        table.children[i].style.display = '';
      } else {
        if (in_array_item(search_content, data[i])) {
          table.children[i].style.display = '';
        } else {
          table.children[i].style.display = 'none';
          hiddenStudentsNumber += 1;
        }
      }
    }
    console.log(hiddenStudentsNumber);
    let str = "共有" + (table.children.length - hiddenStudentsNumber) + "名学生";
    document.getElementById('students_number').innerHTML = str;
  }
  const searchButton = document.getElementById(element);
  searchButton.addEventListener('click', function () {
    response();
  });
  document.addEventListener('keydown', function (event) {
    if (event.keyCode === 13) {
      response();
    }
  });
  let str = "共有" + table.children.length + "名学生";
  document.getElementById('students_number').innerHTML = str;
})('search', 'search-key');

同时在原有的学生信息页面HTML添加：

<div class="row mt-3">
      <a class="btn btn-info col-sm-2" style="margin-right: 28px; margin-left: 15px;" href="add_student.php" rel="external nofollow" >添加学生</a>
// 添加的
      <button class="btn btn-info align-middle" id="students_number"></button>


      <input type="text" class="form-control col-sm-6 ml-2" autocomplete="on" placeholder="请输入关键词" value="" id="search-key">
       <button type="submit" class="btn btn-info col-sm-2 ml-2" id="search">点击搜索</button>
    </div>

总结

以上所述是小编给大家介绍的PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能

- Author -

小方哥·

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
php strcmp使用说明
Apr 22 PHP
php抓取页面与代码解析 推荐
Jul 23 PHP
phpmail类发送邮件函数代码
Feb 20 PHP
PHP中设置时区，记录日志文件的实现代码
Jan 07 PHP
php定时删除文件夹下文件(清理缓存文件)
Jan 23 PHP
浅谈php安全性需要注意的几点事项
Jul 17 PHP
PHP自带函数给数字或字符串自动补齐位数
Jul 29 PHP
非集成环境的php运行环境（Apache配置、Mysql）搭建安装图文教程
Apr 12 PHP
thinkPHP自动验证、自动添加及表单错误问题分析
Oct 17 PHP
利用switch语句进行多选一判断的实例代码
Nov 14 PHP
php检测mysql表是否存在的方法小结
Jul 20 PHP
Jsonp劫持学习
Apr 01 PHP
thinkphp5框架API token身份验证功能示例
May 21 #PHP
php curl操作API接口类完整示例
May 21 #PHP
PHP钩子实现方法解析
May 21 #PHP
php面向对象程序设计中self与static的区别分析
May 21 #PHP
PHP经典设计模式之依赖注入定义与用法详解
May 21 #PHP
PHP常见过waf webshell以及最简单的检测方法
May 21 #PHP
PHP __call()方法实现委托示例
May 20 #PHP
tfx(1) ftpserver(1) ElementTree(1) 面向接口(1) OpenAI baselines(1) BeautifulSoup4(2) tkFileDialog(1) SeaTunnel(1) Odoo(1) NFS(1)
You might like
php 字符过滤类，用于过滤各类用户输入的数据
2009/05/27 PHP
PHP教程 基本语法
2009/10/23 PHP
php中AES加密解密的例子小结
2014/02/18 PHP
Fedora下安装php Redis扩展笔记
2014/09/03 PHP
微信access_token的获取开发示例
2015/04/16 PHP
phplist及phpmailer(组合使用)通过gmail发送邮件的配置方法
2016/03/30 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
js加入收藏夹代码(兼容ie/ff/op)
2014/05/16 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
2014/05/26 Javascript
文本框倒叙输入让输入框的焦点始终在最开始的位置
2014/09/01 Javascript
jQuery切换所有复选框选中状态的方法
2015/07/02 Javascript
bootstrapValidator.min.js表单验证插件
2017/02/09 Javascript
angularjs指令之绑定策略（@、=、&amp;）
2017/04/13 Javascript
EasyUI在Panel上动态添加LinkButton按钮
2017/08/11 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
详细分析React 表单与事件
2020/07/08 Javascript
[08:29]DOTA2每周TOP10 精彩击杀集锦vol.7
2014/06/25 DOTA
Python采用raw_input读取输入值的方法
2014/08/18 Python
python实现linux下使用xcopy的方法
2015/06/28 Python
Python中元组,列表,字典的区别
2017/05/21 Python
python自动化脚本安装指定版本python环境详解
2017/09/14 Python
python使用pygame框架实现推箱子游戏
2018/11/20 Python
详解Python3 对象组合zip()和回退方式*zip
2019/05/15 Python
Django框架基础模板标签与filter使用方法详解
2019/07/23 Python
对python 树状嵌套结构的实现思路详解
2019/08/09 Python
python+Django+pycharm+mysql 搭建首个web项目详解
2019/11/29 Python
Python中Flask-RESTful编写API接口(小白入门)
2019/12/11 Python
TensorFlow学习之分布式的TensorFlow运行环境
2020/02/05 Python
python实现批量修改文件名
2020/03/23 Python
python中什么是面向对象
2020/06/11 Python
canvas实现图片镜像翻转的2种方式
2020/07/22 HTML / CSS
马来西亚排名第一的宠物用品店：Pets Wonderland
2020/04/16 全球购物
采购主管的岗位职责
2013/12/17 职场文书
写给女朋友的道歉信
2014/01/08 职场文书
2014县政府领导班子对照检查材料思想汇报
2014/09/25 职场文书
Windows Server 2008 修改远程登录端口以及配置防火墙
2022/04/28 Servers