用户新增、删除、修改

122 阅读 0 评论 81 点赞

我是靠谱客的博主痴情饼干，这篇文章主要介绍用户新增、删除、修改，现在分享给大家，希望可以做个参考。

删除

1对删除按钮进行监听

2点击删除按钮通过ajax携带用户ID访问删除接口

3后端完成逻辑处理并返回结果信息

4前端通过返回信息弹出提示给管理员

新增

1点击新增弹出新增页面

2对新增保存按钮进行监听

3点击保存按钮ajax携带数据给后端

其中“爱好”的值通过以下代码解析传入后端

复制代码

1
2
3
4
5
6
let hobby = [];//创建数组
$("input[type=checkbox][name=hobby]:checked").each(function (index, obj) {
hobby.push($(obj).attr('title'));//将值存入数组
// }
})
data.hobby = hobby.toLocaleString();

3后端完成逻辑处理并返回结果信息

4前端通过返回信息弹出提示给管理员

修改

1点击修改按钮

2监听当前行的id，通过id查询当前记录

3将获取的数据回显到修改数据页面，并重新渲染标板

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

function setData(data) {
console.log(data);
form.val('example', {
// "username": data.username // "name": "value"
"phone": data.phone
, "email": data.email //复选框选中状态
, "birthday": data.birthday //开关状态
, "sex": data.sex
// , "enable": data.enable
});
$("#username").val(data.username);
//回显爱好
$("input[type=radio][name=enable][value=" + data.enable + "]").attr("checked", "checked")
if (data.address != undefined) {
let hobbys = data.address.split(",");
$("input[type=checkbox][name=hobby]").each(function (index, obj) {
for (let i = 0; i < hobbys.length; i++) {
if (hobbys[i] == $(obj).attr("title")) {
$(obj).attr("checked", "checked");
}
}
})
}
// 重新渲染表单
form.render();
}