layui CURD

1 加载table

// 表格渲染 var tableIns= table.render({ elem: '#dateTable' //指定原始表格元素选择器（推荐id选择器） , height: vipTable.getFullHeight() //容器高度 , cols: [[ //标题栏 {checkbox: true, sort: true, fixed: true, space: true} , {field: 'tid', title: 'ID', width: 80} ,{field: 'teid', title: 'teID', width: 80} , {field: 'tname', title: '用户名', width: 120} , {field: 'email', title: 'email', width: 180} , {field: 'tel', title: 'tel', width: 120} , {field: 'classid', title: '班级', width: 120} , {field: 'subjectid', title: '学科', width: 120} , {field: 'status', title: '状态', width: 70} , {fixed: 'right', title: '操作', width: 240, align: 'center', toolbar: '#barOption'} //这里的toolbar值是模板元素的选择器 ]] , id: 'dataCheck' , url: './../teachers/datetable' , method: 'get' , page: true , limits: [3, 6, 9, 30, 40] , limit: 3 //默认采用3 , loading: false , done: function (res, curr, count) { //如果是异步请求数据方式，res即为你接口返回的信息。 //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度 console.log(res); //得到当前页码 console.log(curr); //得到数据总量 console.log(count); } });

---

2 刷新 // 刷新 $('#btn-refresh').on('click', function () { tableIns.reload({ url:'./../teachers/datetable', done: function(res,curr,count){ this.where={}; } }); });

---

3 // 获取选中行 table.on('checkbox(test)', function (obj) { layer.msg('checkboxtest'); console.log(obj.checked); //当前是否选中状态 console.log(obj.data); //选中行的相关数据 console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one });

---

4 //监听工具条 查询单个 修改 删除 table.on('tool(test)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性"对应的值" var data = obj.data; //获得当前行数据 var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值） var tr = obj.tr; //获得当前行 tr 的DOM对象

if(layEvent === 'detail'){ //查看 //do somehing } else if(layEvent === 'del'){ //删除 layer.confirm('真的删除行么', function(index){ console.log(data); $.ajax({ url: "./../teachers/deleteajax", type: "POST", data:{"tid":data.tid}, dataType: "json", success: function(data){ if(data.state==1){ obj.del(); layer.close(index); layer.msg("删除成功", {icon: 6}); }else{ layer.msg("删除失败", {icon: 5}); } } }); }); }

---

5 //查询按钮点击事件 $('.demoTable .layui-btn').on('click', function(){ var type = $(this).data('type'); var teid = $('#teid'); var tname = $('#tname'); var status = $('#status'); var createdate = $('#createdate'); //按条件查询刷新table tableIns.reload({ url:'./../teachers/datetable', where: { teid: teid.val(), tname: tname.val(), status: status.val(), createdate: createdate.val() },done: function(res,curr,count){ this.where={}; } });

});