<script src="/layuiadmin/layui/layui.js"></script> <script> layui.config({ base: '/layuiadmin/' //静态资源所在路径 }).extend({ index: 'lib/index' //主入口模块 }).use(['index', 'table'], function(){ var $ = layui.$ ,form = layui.form ,table = layui.table; table.render({ elem: "#table_manage", url: "/sysUser/list", page: true, autoSort:false, initSort:{ field: 'createDate' ,type: 'desc' },done:function(res,curr,count){ // 隐藏列 $(".layui-table-box").find("[data-field='id']").css("display","none"); }, cols: [ [ {field: "id",title: "编号",sort: !0}, {field: "name",title: "登陆名",sort: !0}, {field: "ruleName",title: "真实姓名",sort: !0}, {field: "nickName",title: "昵称",sort: !0}, {field: "dept",title: "部门",sort: !0}, {field: "isCanDelete",title: "是否可删除",sort: !0}, {title: "操作",width: 150,align: "center",fixed: "right",toolbar: "#table_operate_html"} ]], text: "对不起,加载出现异常!" }) table.on("sort(table_manage)", function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值" //尽管我们的 table 自带排序功能,但并没有请求服务端。 //有些时候,你可能需要根据当前排序的字段,重新向服务端发送请求,从而实现服务端排序,如: console.log(obj); table.reload("table_manage", { initSort: obj //记录初始排序,如果不设的话,将无法标记表头的排序状态。 layui 2.1.1 新增参数 ,where: { //请求参数(注意:这里面的参数可任意定义,并非下面固定的格式) field: obj.field //排序字段 ,order: obj.type //排序方式 } }); }); table.on("tool(table_manage)", function(e) { e.data; if ("del" === e.event){ layer.confirm("确定删除此用户?", function(t) { $.ajax({ type: "post", url: "/sysUser/delete?id="+e.data.id, success: function (result) { console.log(result); table.reload('table_manage'); //数据刷新 layer.close(t); //关闭弹层 } }); }); } else if ("edit" === e.event) { console.log($(e.tr)); layer.open({ type: 2, title: "编辑用户", content: "/sysUser/prepareUpdate?id="+e.data.id, area: ["420px", "420px"], btn: ["确定", "取消"], yes: function(e, t) { var l = window["layui-layer-iframe" + e], r = "manager_submit", n = t.find("iframe").contents().find("#" + r); l.layui.form.on("submit(" + r + ")", function(t) { t.field; console.log(t.field); $.ajax({ type: "post", url: "/sysUser/update", data:t.field, success: function (result) { console.log(result); table.reload('table_manage'); //数据刷新 layer.close(e); //关闭弹层 } }); }), n.trigger("click") }, success: function(e, t) {} }) } }) //监听搜索 form.on('submit(manager_search)', function(data){ var field = data.field; //执行重载 table.reload('table_manage', { where: field }); }); //事件 var active = { batchdel: function(){ var checkStatus = table.checkStatus('table_manage') ,checkData = checkStatus.data; //得到选中的数据 if(checkData.length === 0){ return layer.msg('请选择数据'); } layer.prompt({ formType: 1 ,title: '敏感操作,请验证口令' }, function(value, index){ layer.close(index); layer.confirm('确定删除吗?', function(index) { //执行 Ajax 后重载 /* admin.req({ url: 'xxx' //,…… }); */ table.reload('table_manage'); layer.msg('已删除'); }); }); } ,add: function(){ layer.open({ type: 2 ,title: '添加用户' ,content: '/sysUser/prepareInsert' ,area: ['420px', '420px'] ,btn: ['确定', '取消'] ,yes: function(index, layero){ var iframeWindow = window['layui-layer-iframe'+ index] ,submitID = 'manager_submit' ,submit = layero.find('iframe').contents().find('#'+ submitID); //监听提交 iframeWindow.layui.form.on('submit('+ submitID +')', function(data){ var field = data.field; //获取提交的字段 console.log(field); //提交 Ajax 成功后,静态更新表格中的数据 $.ajax({ type: "post", url: "/sysUser/insert", data:field, success: function (result) { console.log(result); table.reload('table_manage'); //数据刷新 layer.close(index); //关闭弹层 } }); }); submit.trigger('click'); } }); } } $('.layui-btn.layuiadmin-btn-admin').on('click', function(){ var type = $(this).data('type'); active[type] ? active[type].call(this) : ''; }); }); </script>