增加学生记录
let studentNo = $("#studentNo").val()
let name = $("#studentName").val()
let age = parseInt($("#studentAge").val())
let sex = $("#studentSex").find("option:selected").val()
let data = {"studentNo":studentNo,"name":name,"age":age,"sex":sex}
- 利用ajax传递新增学生信息给后端,后端返回结果为受影响的行数
$.ajax({
url: '/student/add',
type: 'POST',
dataType: 'json',
data:data
})
.done(function (dat) {
console.log(dat)
if ( dat === 1 ) {
alert('添加成功');
location.reload();
}
})
.fail(function () {
alert('服务器超时,请重试!');
});
删除学生记录
let tr1 = obj.parentNode.parentNode
let id = tr1.cells[0].innerText
$.ajax({
url: '/student/delete',
type: 'DELETE',
dataType:'json',
data:{"id":id}
})
.done(function (dat) {
console.log(dat)
alert("删除成功!")
location.reload();
})
.fail(function () {
alert('服务器超时,请重试!');
});
更新学生记录
- 对于待更新学生记录,采用获取当前行数据的方式对待更新框进行赋值
var tr1 = obj.parentNode.parentNode
$("#studentNoU").attr("value",tr1.cells[0].innerText)
$("#studentNameU").attr("value",tr1.cells[1].innerText)
$("#studentAgeU").attr("value",tr1.cells[2].innerText)
document.getElementById("studentSexU").value= tr1.cells[3].innerText;
readonly="true"
let studentNo = $("#studentNoU").val()
let name = $("#studentNameU").val()
let age = parseInt($("#studentAgeU").val())
let sex = $("#studentSexU").find("option:selected").val()
let data = {"studentNo":studentNo,"name":name,"age":age,"sex":sex}
- 传递更新的数据到后端进行更新操作,返回受影响的行数
$.ajax({
url: '/student/update',
type: 'PUT',
dataType: 'json',
data:data
})
.done(function (dat) {
console.log(dat)
if ( dat === 1 ) {
alert('更新成功');
location.reload();
}
})
.fail(function () {
alert('服务器超时,请重试!');
});
查询学生表
$.ajax({
url: '/student/getAll',
type: 'GET',
dataType: 'json'
})
.done(function (dat) {
data = dat
showData(data)
})
.fail(function () {
alert('服务器超时,请重试!');
});
function showData(data) {
let str = "";
for (let i = 0; i < data.length; i++) {
str = "<tr><td>" + data[i].studentNo + "</td><td>" + data[i].name + "</td><td>" + data[i].age + "</td><td>" + data[i].sex+ "</td>"
+'<td> <button type="button" οnclick="deleteStudent(this)" >删除</button > <button type="button" οnclick="updateStudent(this)" >更新</button ></td>'
+"</tr>";
$("#container").append(str);
}
}
[
{
"studentNo": "s001",
"name": "张三",
"age": 23,
"sex": "男"
},
{
"studentNo": "s002",
"name": "李四",
"age": 23,
"sex": "男"
}
]