48 lines
1.6 KiB
HTML
48 lines
1.6 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html>
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<title>选课记录</title>
|
|||
|
|
<link rel="stylesheet" href="js/layui-v2.5.6/layui/css/layui.css" media="all">
|
|||
|
|
</head>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<table id="demo" class="layui-hide" lay-filter="xk"></table>
|
|||
|
|
|
|||
|
|
<script type="text/html" id="barDemo">
|
|||
|
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">撤销</a>
|
|||
|
|
</script>
|
|||
|
|
<script src="js/layui-v2.5.6/layui/layui.all.js"></script>
|
|||
|
|
<script>
|
|||
|
|
layui.use('table', function(){
|
|||
|
|
var table = layui.table;
|
|||
|
|
table.render({
|
|||
|
|
elem: '#demo'
|
|||
|
|
,url: 'files/xkjl.json' //数据接口
|
|||
|
|
,cellMinWidth: 80 //全局定义常规单元格的最小宽度
|
|||
|
|
,page: true //开启分页
|
|||
|
|
,cols: [[ //表头
|
|||
|
|
{field: 'kcbt', title: '课程标题'}
|
|||
|
|
,{field: 'kclx', title: '课程类型'}
|
|||
|
|
,{field: 'sqzt', title: '申请状态'}
|
|||
|
|
,{field: 'sqsj', title: '申请时间'}
|
|||
|
|
,{fixed: 'right', title: '撤销',width: 165, align:'center', toolbar: '#barDemo'}
|
|||
|
|
]]
|
|||
|
|
});
|
|||
|
|
//监听行工具事件
|
|||
|
|
table.on('tool(xk)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
|
|||
|
|
var data = obj.data //获得当前行数据
|
|||
|
|
,layEvent = obj.event; //获得 lay-event 对应的值
|
|||
|
|
if(layEvent === 'del'){
|
|||
|
|
layer.confirm('是否撤销申请', function(index){
|
|||
|
|
obj.del(); //删除对应行（tr）的DOM结构
|
|||
|
|
layer.close(index);
|
|||
|
|
//向服务端发送删除指令
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|