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

php  /  管理员 发布于 7年前   211

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

删除学生功能

PHP:

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

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

HTML:

        
    
编辑学生
        
        
            
        
              
          请选择学院/系>电气工程学院>信息工程与艺术学院>国际教育学院>水利水电工程学院>测绘与市政工程学院>马克思主义学院>建筑工程学院>经济与管理学院              
              
              
          请选择性别 value="1">男 value="0">女              
          出生日期              
          照片              确认修改            

PHP:

if (empty($_GET['id'])) exit('
必须指定相应的学号
');$current_num = $_GET['id'];$connection = mysqli_connect('localhost', 'root', '密码', 'students_info_system');if (!$connection) exit('
连接数据库失败
');$query = mysqli_query($connection, "select * from students where num = {$current_num} limit 1");if (!$query) exit('
找不到您要编辑的学生信息
');$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('
其余学生数据查询失败
');    // 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添加：

      添加学生　　　　　　　　// 添加的      　　　　　　　　             点击搜索    

总结

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

您可能感兴趣的文章:

• JavaScript中使用Substring删除字符串最后一个字符
• javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】
• JS实现数组删除指定元素功能示例
• JavaScript怎样在删除前添加确认弹出框?
• 初学node.js中实现删除用户路由
• 原生JS实现动态添加新元素、删除元素方法
• JS删除String里某个字符的方法