<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- web路徑：
不以/開始的相對路徑，找資源，以當前資源的路徑爲基準，經常容易出問題。
以/開始的相對路徑，找資源，以服務器的路徑爲標準(http://localhost:3306)；需要加上項目名
http://localhost:3306/wolf-crud
-->
<%
pageContext.setAttribute("APP_PATH", request.getContextPath());
%>
<script type="text/javascript" src="${APP_PATH }/static/js/jquery-1.12.4.js"></script>
<link href="${APP_PATH }/static/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<script src="${APP_PATH }/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<title>員工列表（AjAX請求後臺數據）</title>
</head>
<body>
<!--員工修改模態框 -->
<!-- Modal -->
<div class="modal fade" id="empUpdateModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">員工修改</h4>
</div>
<!--表單內容 -->
<div class="modal-body">
<form class="form-horizontal">
<div class="form-group">
<label for="empName_update_input" class="col-sm-2 control-label">員工姓名</label>
<div class="col-sm-10">
<p class="form-control-static" id="empName_update_static"></p>
<!-- <input type="text" class="form-control" name="empName" id="empName_update_input" placeholder="empName"> -->
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label for="email_update_input" class="col-sm-2 control-label">電子郵箱</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="email" id="email_update_input" placeholder="[email protected]">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">員工性別</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="gender" id="gender1_update_input" value="M" checked="checked"> 男
</label>
<label class="radio-inline">
<input type="radio" name="gender" id="gender2_update_input" value="F"> 女
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">所屬部門</label>
<div class="col-sm-4">
<select class="form-control" name="dId" id="dept_update_select">
</select>
</div>
</div>
</form>
</div>
<!--表單內容結束 -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
<button type="button" class="btn btn-primary" id="emp_update_btn">更新</button>
</div>
</div>
</div>
</div>
<!--員工添加模態框 -->
<!-- Modal -->
<div class="modal fade" id="empAddModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">員工添加</h4>
</div>
<!--表單內容 -->
<div class="modal-body">
<form class="form-horizontal">
<div class="form-group">
<label for="empName_add_input" class="col-sm-2 control-label">員工姓名</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="empName" id="empName_add_input" placeholder="empName">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label for="email_add_input" class="col-sm-2 control-label">電子郵箱</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="email" id="email_add_input" placeholder="[email protected]">
<span class="help-block"></span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">員工性別</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="gender" id="gender1_add_input" value="M" checked="checked"> 男
</label>
<label class="radio-inline">
<input type="radio" name="gender" id="gender2_add_input" value="F"> 女
</label>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">所屬部門</label>
<div class="col-sm-4">
<select class="form-control" name="dId" id="dept_add_select">
</select>
</div>
</div>
</form>
</div>
<!--表單內容結束 -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
<button type="button" class="btn btn-primary" id="emp_save_btn">保存</button>
</div>
</div>
</div>
</div>
<div class="container">
<!--標題 -->
<div class="row">
<div class="col-md-12">
<h1>SSM增刪改查實例</h1>
</div>
</div>
<!--按鈕 -->
<div class="row">
<div class="col-md-4 col-md-offset-8">
<button class="btn btn-primary" id="emp_add_model_btn">新增</button>
<button class="btn btn-danger" id="emp_delete_all_btn">刪除</button>
</div>
</div>
<!--顯示錶格數據 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<!--表格頭 -->
<thead>
<tr>
<th>
<input type="checkbox" id="check_all"/>
</th>
<th>員工ID</th>
<th>員工姓名</th>
<th>員工性別</th>
<th>郵箱地址</th>
<th>部門名稱</th>
<th>操作</th>
</tr>
</thead>
<!--表格體 -->
<tbody></tbody>
</table>
</div>
</div>
<!--顯示分頁信息 -->
<div class="row">
<!--分頁文字信息 -->
<div class="col-md-6" id="page_info_area">
<!-- 當前頁，總頁，總條記錄 -->
</div>
<!--分頁條信息 -->
<div class="col-md-6" id="page_nav_area">
</div>
</div>
</div>
<script type="text/javascript">
//定義全局變量，總記錄數
var totalRecord,currentPage;
//頁面加載完成以後，直接去發送ajax請求，要到分頁數據
$(function(){
//頁面加載完默認進首頁
to_page(1);
});
//點擊頁面時，實現頁碼跳轉
function to_page(pn){
$.ajax({
url:"${APP_PATH}/empwithdeptjson",
data:"pn="+pn,//pn是用戶指定跳轉的頁碼數
type:"post",
//請求成功的回調函數，result是服務器響應給瀏覽器的數據
success:function(result){
//console.log(result);//需要在瀏覽器的控制檯中查看
//1.解析並顯示員工數據
build_emps_table(result);
//2.解析並顯示分頁信息
build_page_info(result);
//3.解析顯示分頁條
build_page_nav(result);
}
});
}
function build_emps_table(result){
//清空table表格
$("#emps_table tbody").empty();
//獲取json串中返回的結果集（庫表中的數據）
var emps=result.extend.pageInfo.list;
//循環遍歷結果集==>循環遍歷所有員工數據
//參數1：要遍歷的emps集合，參數2:每次遍歷的回調函數
//回調函數：參數1：索引，參數2：當前對象
$.each(emps,function(index,item){
//alert(item.empName);
//把解析的數據放到表格中展示，以下的DOM解析表格
var checkBoxTd=$("<td><input type='checkbox' class='check_item'></td>")
var empIdTd=$("<td></td>").append(item.empId);
var empNameTd=$("<td></td>").append(item.empName);
//var gender=item.gender=='M'?"男":"女";
var genderTd=$("<td></td>").append(item.gender=='M'?"男":"女");
var emailTd=$("<td></td>").append(item.email);
var deptNameTd=$("<td></td>").append(item.department.deptName);
/*
<button class="btn btn-primary btn-sm">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> 編輯
</button>
<button class="btn btn-danger btn-sm">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> 刪除
</button>
*/
var editBtn=$("<button></button>").addClass("btn btn-primary btn-sm edit_btn")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil")).append(" ").append("編輯");
//爲編輯按鈕添加一個自定義的屬性，來表示當前員工id
editBtn.attr("edit-id",item.empId);
var delBtn=$("<button></button>").addClass("btn btn-danger btn-sm delete_btn")
.append($("<span></span>").addClass("glyphicon glyphicon-trash")).append(" ").append("刪除");
//爲刪除按鈕添加一個自定義的屬性，來表示當前刪除的員工id
delBtn.attr("del-id",item.empId);
var btnTd=$("<td></td>").append(editBtn).append(" ").append(delBtn);
//append方法執行完成以後還是返回原來的元素
$("<tr></tr>").append(checkBoxTd).append(empIdTd).append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(btnTd)
.appendTo("#emps_table tbody");
});
}
//解析顯示分頁信息
function build_page_info(result){
//清空分頁信息
$("#page_info_area").empty();
$("#page_info_area").append("當前"+result.extend.pageInfo.pageNum+"頁，總"+
result.extend.pageInfo.pages+"頁，總"+
result.extend.pageInfo.total+"條記錄");
totalRecord=result.extend.pageInfo.total;
currentPage=result.extend.pageInfo.pageNum;
}
/*
<nav aria-label="Page navigation">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
*/
//解析顯示分頁條
function build_page_nav(result){
//清空分頁導航
$("#page_nav_area").empty();
//page_nav_area
//創建ul
var ul=$("<ul></ul>").addClass("pagination");
//首頁
var firstPageLi=$("<li></li>").append($("<a></a>").append("首頁").attr("href","#"));
//前一頁
var prePageLi=$("<li></li>").append($("<a></a>").append($("<span></span>").append("«")));
//如果沒有了前一頁，首頁和前一頁按鈕不可用
if(result.extend.pageInfo.hasPreviousPage==false){
firstPageLi.addClass("disabled");
prePageLi.addClass("disabled");
}
//爲元素添加點擊翻頁事件
//首頁單擊事件
firstPageLi.click(function(){
to_page(1);
});
//上一頁單擊事件:當前頁-1
prePageLi.click(function(){
to_page(result.extend.pageInfo.pageNum-1);
});
//後一頁
var nextPageLi=$("<li></li>").append($("<a></a>").append($("<span></span>").append("»")));
//末頁
var lastPageLi=$("<li></li>").append($("<a></a>").append("末頁").attr("href","#"));
//如果沒有了下一頁，末頁和下一頁按鈕不可用
if(result.extend.pageInfo.hasNextPage==false){
nextPageLi.addClass("disabled");
lastPageLi.addClass("disabled");
}
//下一頁的單擊事件：當前頁+1
nextPageLi.click(function(){
to_page(result.extend.pageInfo.pageNum+1);
});
lastPageLi.click(function(){
to_page(result.extend.pageInfo.pages);
});
//添加首頁和前一頁的提示
ul.append(firstPageLi).append(prePageLi);
//循環遍歷給ul中添加頁碼提示，取出頁碼號 1,2,3,4,5，
$.each(result.extend.pageInfo.navigatepageNums,function(index,item){
var numLi=$("<li></li>").append($("<a></a>").append(item));
//如果當前頁碼等於正在循環遍歷的頁碼，則頁碼變色
if(result.extend.pageInfo.pageNum==item){
numLi.addClass("active");
}
//給頁碼添加單擊事件
numLi.click(function(){
to_page(item);
});
ul.append(numLi);
});
//添加下一頁和末頁的提示
ul.append(nextPageLi).append(lastPageLi);
//創建nav,將ul標籤添加到nav標籤中
var nav=$("<nav></nav>").append(ul);
//將分頁條添加到上面id中
nav.appendTo("#page_nav_area");
}
// 清除表單數據（表單重置--表單的數據，表單的樣式）
function reset_form(ele){
$(ele)[0].reset();//清空表單數據，防止再次打開模態框時，帶有之前添加的的數據
//清空模態框表單中上次殘留的樣式
$(ele).find("*").removeClass("has-error has-success");
$(ele).find(".help-block").text("");
}
//點擊新增按鈕彈出模態框
$("#emp_add_model_btn").click(function(){
//1.清除表單數據（表單重置--表單的數據，表單的樣式）,獲取表單,jquery沒有reset()方法，需要轉成原生對象
// $("#empAddModal form")[0].reset(); -->統一寫一個函數，見上面
reset_form("#empAddModal form");
//2.發送ajax請求，查出部門信息，顯示在下拉列表中
getDepts("#dept_add_select");
//3.彈出模態框
$("#empAddModal").modal({
backdrop:"static"
});
});
//查出所有部門信息，顯示在下拉列表中
function getDepts(ele){
$(ele).empty(); //$("#dept_add_select").empty();
$.ajax({
//向後臺發送請求
url:"${APP_PATH}/depts",
type:"GET",
//拿到請求查詢的結果result
success:function(result){
//console.log(result)
//{"code":100,"msg":"處理成功","extend":{"depts":[{"deptId":1,"deptName":"開發部"},{"deptId":2,"deptName":"測試部"}]}}
//顯示部門信息到下拉列表中,有2種獲取下拉列表的方式
//$("#empAddModal select")
//$("#dept_add_select")
//循環遍歷部門信息
$.each(result.extend.depts,function(){
var optionEle=$("<option></option>").append(this.deptName).attr("value",this.deptId);
optionEle.appendTo(ele);
})
}
});
}
//前端校驗：校驗表單數據
function validate_add_form(){
//1.拿到要校驗的數據（通過id獲取），使用正則表達式
var empName=$("#empName_add_input").val();//獲取文本框的值
var regName=/(^[a-zA-Z0-9_-]{6,16}$)|(^[\u2E80-\u9FFF]{2,5})/;
// alert(regName.test(empName));
if(!regName.test(empName)){//如果校驗失敗
//alert("用戶名可以是2-5位中文或者6-16位英文和數字的組合");
// 給input文本框的父元素添加提示樣式,文本框變色
show_validate_msg("#empName_add_input","error","用戶名可以是2-5位中文或者6-16位英文和數字的組合");
return false; //校驗失敗，返回false不在向下執行
}else{
show_validate_msg("#empName_add_input","success","");
//$("#empName_add_input").parent().addClass("has-success");
//$("#empName_add_input").next("span").text("");
}
//2.校驗郵箱
var email=$("#email_add_input").val();//獲取郵箱的文本框的值
var regEmail=/^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/;
if(!regEmail.test(email)){
//alert("郵箱格式不正確");
//應該清空這個元素之前的樣式
show_validate_msg("#email_add_input","error","郵箱格式不正確");
//$("#email_add_input").parent().addClass("has-error");
//$("#email_add_input").next("span").text("郵箱格式不正確");
return false;
}else{
show_validate_msg("#email_add_input","success","");
//$("#email_add_input").parent().addClass("has-success");
//$("#email_add_input").next("span").text("");
}
return true;
}
//顯示校驗結果的提示信息模板
function show_validate_msg(ele,status,msg){
//清除當前元素的校驗狀態
$(ele).parent().removeClass("has-success has-error");
$(ele).next("span").text("");
if("success"==status){
$(ele).parent().addClass("has-success");
$(ele).next("span").text(msg);
}else if("error"==status){
$(ele).parent().addClass("has-error");
//獲取當前輸入框元素的下一個元素span,將span元素的文本值設置成提示信息
$(ele).next("span").text(msg);
}
}
//綁定文本框改變事件：當文本框裏面的內容發生改變以後，檢驗用戶名是否可用
$("#empName_add_input").change(function(){
var empName=this.value;
//alert("*****"+empName);
//var empName=$("#empName_add_input").val();
//發送ajax請求校驗用戶名是否可用
$.ajax({
url:"${APP_PATH}/checkuser",
type:"POST",
data:"empName="+empName,
dataType:"json",
success:function(result){
if(result.code==100){
$("#emp_save_btn").attr("ajax-va","success");
show_validate_msg("#empName_add_input","success","用戶名可用");
}else{
show_validate_msg("#empName_add_input","error",result.extend.va_msg);//result.extend.va_msg：獲取後臺數據 --該用戶名不可以使用
$("#emp_save_btn").attr("ajax-va","error");
}
}
});
});
//保存按鈕的單擊事件，實現點擊按鈕保存員工數據
$("#emp_save_btn").click(function(){
//模態框中填寫的表單數據提交給服務器進行保存
//1.先要對提交給服務器的數據進行校驗,前端校驗,註釋掉可以測試後端JSR303校驗
if(!validate_add_form()){
return false;
};
//判斷之前的ajax用戶名校驗是否成功，如果用戶名已存在，則保存按鈕不可用
//獲取當前按鈕的屬性值
if($("#emp_save_btn").attr("ajax-va")=="error"){
return false;
}
//2.發送ajax請求保存員工,serialize()序列表表格內容爲字符串，用於Ajax請求
//獲取表單,並將表單序列化empName=%E5%AD%9D%E6%B8%85&email=xiaoqing%40163.com&gender=F&dId=2
//alert($("#empAddModal form").serialize());
$.ajax({
url:"${APP_PATH}/emp",
type:"POST",
data:$("#empAddModal form").serialize(),
success:function(result){
//{"code":100,"msg":"處理成功","extend":{"depts":[{"deptId":1,"deptName":"開發部"},{"deptId":2,"deptName":"測試部"}]}}
// alert(result.msg);
if(result.code==100){
// 員工保存成功後：
// 1.關閉模態框
$('#empAddModal').modal('hide');
// 2、來到最後一頁，顯示剛纔保存的數據
//發送ajax請求，顯示最後一頁數據即可
to_page(totalRecord);
}else{
//JSR303後端校驗失敗，顯示失敗信息
console.log(result);//Objectcode: 200 extend: Objectmsg: "處理失敗"__proto__: Object
//有那個字段的錯誤信息就顯示那個字段的信息
alert(result.extend.errorFields.email);
alert(result.extend.errorFields.empName);
if(undefined!=result.extend.errorFields.email){
//顯示郵箱錯誤信息
show_validate_msg("#email_add_input","error",result.extend.errorFields.email);
}
if(undefined!=result.extend.errorFields.empName){
//顯示員工名字的錯誤信息
show_validate_msg("#empName_add_input","error",result.extend.errorFields.empName);
}
}
}
})
});
// 給jquery動態創建的編輯按鈕綁定事件，沒有id屬性的按鈕，給class屬性的一個值綁定單擊事件
$(document).on("click",".edit_btn",function(){
//alert("綁定單擊事件");
//1.查出部門信息，並顯示部門列表
getDepts("#dept_update_select") //getDepts("#empUpdateModal select")
//2.查出員工信息，顯示員工信息
//getEmp(id);//?如何獲取每一個編輯按鈕的員工id-->editBtn.attr("edit-id",item.empId);
getEmp($(this).attr("edit-id")); //this代表當前被點擊的按鈕
//3.把員工id傳遞給模態框的更新按鈕
$("#emp_update_btn").attr("edit-id",$(this).attr("edit-id"));
//4.彈出模態框
$("#empUpdateModal").modal({
backdrop:"static"
});
})
//查出員工信息，顯示員工信息
function getEmp(id){
$.ajax({
url:"${APP_PATH}/emp/"+id, //@RequestMapping(value="/emp/{id}",method=RequestMethod.GET)
type:"GET",
success:function(result){
//console.log(result);
//獲取到服務端返回的所有員工數據
var empData=result.extend.emp;
$("#empName_update_static").text(empData.empName);//給p標籤之類的賦值用text()屬性
$("#email_update_input").val(empData.email);//給文本框賦值用val()屬性
// 獲取 單選按鈕的方法 有多種 $("#empUpdateModa input[name=gender]")
$("#empUpdateModal input[type=radio]").val([empData.gender]);
//給下拉列表賦值
$("#empUpdateModal select").val([empData.dId]);
}
})
}
//修改：給更新按鈕綁定單擊事件
$("#emp_update_btn").click(function(){
//1.驗證郵箱是否合法
var email=$("#email_update_input").val();//獲取郵箱的文本框的值
var regEmail=/^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/;
if(!regEmail.test(email)){
//alert("郵箱格式不正確");
//應該清空這個元素之前的樣式
show_validate_msg("email_update_input","error","郵箱格式不正確");
//$("#email_add_input").parent().addClass("has-error");
//$("#email_add_input").next("span").text("郵箱格式不正確");
return false;
}else{
show_validate_msg("#email_update_input","success","");
//$("#email_add_input").parent().addClass("has-success");
//$("#email_add_input").next("span").text("");
}
//2.發送ajax數據，保存修改的數據
$.ajax({
//如何獲取頁面的員工id-->把員工id的值綁定到更新按鈕上
url:"${APP_PATH}/emp/"+$(this).attr("edit-id"),
type:"PUT", //<filter-name>HttpPutFormContentFilter</filter-name>
data:$("#empUpdateModal form").serialize(),
//type:"POST",
//data:$("#empUpdateModal form").serialize()+"&_method=PUT",
success:function(result){
//console.log(result);
//alert(result.msg);
//關閉模態框
$("#empUpdateModal").modal("hide");
//回到本頁面,如何做到-->全局變量：currentPage
to_page(currentPage);
}
});
});
//單個刪除：給jquery動態創建的刪除按鈕綁定事件，沒有id屬性的按鈕，給class屬性的一個值綁定單擊事件
$(document).on("click",".delete_btn",function(){
//1.彈出是否確認刪除對話框
//(1)如何獲取員工姓名:獲取當前按鈕的所有祖先節點，在找第二個<td>
//alert($(this).parents("tr").find("td:eq(1)").text());
var empName=$(this).parents("tr").find("td:eq(2)").text();
var empId=$(this).attr("del-id");
if(confirm("確認刪除【"+empName+"】嗎？")){
//確認，發送ajax請求刪除即可
$.ajax({
//給刪除按鈕綁定id
url:"${APP_PATH}/emp/"+empId,
type:"DELETE",
success:function(result){
//alert(result.msg);
//回到本頁
to_page(currentPage);
}
});
}
});
//完成全選/全不選的事件功能
$("#check_all").click(function(){
//attr獲取checked是undefined;
//我們這些dom原生的屬性比如checked，我們用prop()獲取原生的屬性值，而attr獲取自定義屬性的值
//prop修改和讀取dom原生屬性值
//alert($(this).prop("checked"));
//選中標題行的複選框，下面的複選框跟着一起選中
$(".check_item").prop("checked",$(this).prop("checked"));
});
//全部選中表格體中的複選框時，上面標題中的複選框也跟着選中
$(document).on("click",".check_item",function(){
//alert($(".check_item:checked").length);
var flag = $(".check_item:checked").length==$(".check_item").length;
$("#check_all").prop("checked",flag);
});
//批量刪除的單擊事件
$("#emp_delete_all_btn").click(function(){
var empNames ="";
var del_idstr ="";
//先找到被選中的複選框,然後循環遍歷
$.each($(".check_item:checked"),function(){
//this代表當前被循環到的複選框,打印所有選中的員工姓名
//alert($(this).parents("tr").find("td:eq(2)").text());
empNames+=$(this).parents("tr").find("td:eq(2)").text() +",";
//組裝員工id的字符串
del_idstr+=$(this).parents("tr").find("td:eq(1)").text() +"-";
});
//去除empNames多餘的逗號，
empNames=empNames.substring(0,empNames.length-1);
//去除del_idstr對於的“-”
del_idstr=del_idstr.substring(0,empNames.length-1);
if(confirm("確認刪除【"+empNames+"】嗎？")){
//爲true時，確認刪除name的值，發送ajax請求
$.ajax({
url:"${APP_PATH}/emp/"+del_idstr,
type:"DELETE",
success:function(result){
alert(result.msg);
//回到當前頁面
to_page(currentPage);
}
})
}
});
</script>
</body>
</html>SSM框架AJAX分頁 PageHelper查詢,增刪改 前端業務邏輯
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章