這個自己的小項目要先告一段落了?？赡苓€有許多bug。請見諒
刪除學(xué)生功能
PHP:
// 這里是通過前端代碼HTML中的 url 傳過來的，用 $_GET 來獲取(相關(guān)HTML代碼可以看一下到主頁看一下前幾條博客)
if (empty($_GET['num'])) exit('h1>找不到您要刪除的學(xué)生的學(xué)號/h1>');
$num = $_GET['num'];
$connection = mysqli_connect('localhost', 'root', '密碼', 'students_info_system');
if (!$connection) exit('h1>連接數(shù)據(jù)庫失敗/h1>');
$query = mysqli_query($connection, "delete from students where num = {$num}");
if (!$query) exit('h1>該學(xué)生信息查詢失敗/h1>');
// 注意：這里傳入的是連接對象
$affected_rows = mysqli_affected_rows($connection);
if ($affected_rows !== 1) exit('h1>刪除失敗/h1>');
header('Location: student_info.php');
編輯學(xué)生功能(整體上和添加學(xué)生功能差不到，稍微有些許變化)
HTML:
!DOCTYPE html>
html>
head>
meta charset="utf-8">
title>編輯學(xué)生/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">編輯學(xué)生/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="學(xué)號" value="?php echo isset($_POST['num']) ? $_POST['num'] : $current_student['num']; ?>">
/div>
div class="form-group">
select class="form-control" name="system">
option>請選擇學(xué)院/系/option>
option ?php echo $current_student['system'] === '電氣工程學(xué)院' ? 'selected' : ''; ?>>電氣工程學(xué)院/option>
option ?php echo $current_student['system'] === '信息工程與藝術(shù)學(xué)院' ? 'selected' : ''; ?>>信息工程與藝術(shù)學(xué)院/option>
option ?php echo $current_student['system'] === '國際教育學(xué)院' ? 'selected' : ''; ?>>國際教育學(xué)院/option>
option ?php echo $current_student['system'] === '水利水電工程學(xué)院' ? 'selected' : ''; ?>>水利水電工程學(xué)院/option>
option ?php echo $current_student['system'] === '測繪與市政工程學(xué)院' ? 'selected' : ''; ?>>測繪與市政工程學(xué)院/option>
option ?php echo $current_student['system'] === '馬克思主義學(xué)院' ? 'selected' : ''; ?>>馬克思主義學(xué)院/option>
option ?php echo $current_student['system'] === '建筑工程學(xué)院' ? 'selected' : ''; ?>>建筑工程學(xué)院/option>
option ?php echo $current_student['system'] === '經(jīng)濟與管理學(xué)院' ? 'selected' : ''; ?>>經(jīng)濟與管理學(xué)院/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>必須指定相應(yīng)的學(xué)號/h1>');
$current_num = $_GET['id'];
$connection = mysqli_connect('localhost', 'root', '密碼', 'students_info_system');
if (!$connection) exit('h1>連接數(shù)據(jù)庫失敗/h1>');
$query = mysqli_query($connection, "select * from students where num = {$current_num} limit 1");
if (!$query) exit('h1>找不到您要編輯的學(xué)生信息/h1>');
$current_student = mysqli_fetch_assoc($query);
// var_dump($current_student);
function edit_student() {
// var_dump('進來了');
global $connection;
global $current_num; // 當前學(xué)生學(xué)號
global $current_student;
$extra_students_query = mysqli_query($connection, "select * from students where num != {$current_num}");
if (!$extra_students_query) {
exit('h1>其余學(xué)生數(shù)據(jù)查詢失敗/h1>');
// return;
}
// 查詢除該學(xué)生以外的其他學(xué)生
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'] = '請輸入學(xué)號';
return;
}
// 判斷該學(xué)號是否已經(jīng)被添加(即列表中已存在該學(xué)生)=========
if (in_array($_POST['num'], $students_num)) {
$GLOBALS['error_msg'] = '該學(xué)生已存在';
return;
}
if (empty($_POST['system']) || $_POST['system'] === '請選擇學(xué)院/系') {
$GLOBALS['error_msg'] = '請選擇學(xué)院/系';
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;
}
// 文件上傳到了服務(wù)端開辟的一個臨時地址，需要轉(zhuǎn)移到本地
$image_target = 'images/' . $_FILES['photo']['name'];
if (!move_uploaded_file($_FILES['photo']['tmp_name'], $image_target)) {
$GLOBALS['error_msg'] = '圖片上傳失敗';
return;
}
// 接收更新過的學(xué)生照片
$current_student['photo'] = (string)$image_target;
} else {
// var_dump($_FILES['photo']);
// 如果照片沒有上傳則不進行驗證文件域,直接更新數(shù)據(jù)且不改變原來的照片
$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);
// 將數(shù)據(jù)修改存放到數(shù)據(jù)庫
$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'] = '更新數(shù)據(jù)查詢失敗';
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）
// 關(guān)鍵詞搜索功能----立即函數(shù)
(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; // 獲取隱藏的學(xué)生個數(shù)(即表格隱藏行數(shù))
// 獲取要搜索的關(guān)鍵詞
const search_content = document.getElementById(search_key).value;
// console.log(search_content);
// console.log(typeof(search_content));
let data = [];
// 遍歷列表將數(shù)據(jù)存儲到一個數(shù)組中
// 1.獲取表格行數(shù)
for (let i = 0; i table.children.length; i++) {
// 2.獲取表格列數(shù)
for (let j = 0; j table.children[i].children.length; j++) {
if (!data[i]) {
// 在數(shù)組中創(chuàng)鍵每一行內(nèi)容存放的數(shù)組，用于存放一行數(shù)據(jù)
data[i] = new Array();
}
data[i][j] = table.children[i].children[j].innerHTML.toString();
// 3.存放數(shù)據(jù)
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) + "名學(xué)生";
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 + "名學(xué)生";
document.getElementById('students_number').innerHTML = str;
})('search', 'search-key');
同時在原有的學(xué)生信息頁面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" >添加學(xué)生/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="請輸入關(guān)鍵詞" value="" id="search-key">
button type="submit" class="btn btn-info col-sm-2 ml-2" id="search">點擊搜索/button>
/div>
總結(jié)
以上所述是小編給大家介紹的PHP 結(jié)合 Boostrap 結(jié)合 js 實現(xiàn)學(xué)生列表刪除編輯及搜索功能，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的！
您可能感興趣的文章:- JavaScript中使用Substring刪除字符串最后一個字符
- javascript數(shù)組常見操作方法實例總結(jié)【連接、添加、刪除、去重、排序等】
- JS實現(xiàn)數(shù)組刪除指定元素功能示例
- JavaScript怎樣在刪除前添加確認彈出框?
- 初學(xué)node.js中實現(xiàn)刪除用戶路由
- 原生JS實現(xiàn)動態(tài)添加新元素、刪除元素方法
- JS刪除String里某個字符的方法
