> 文章列表 > layUI 表格

layUI 表格

layUI 表格

layUI 表格
layUI 表格
layUI 表格

/* 表格头工具栏点击事件 */table.on('toolbar(roleTable)', function(obj) {var checkRows = table.checkStatus('roleTable');var ids = checkRows.data.map(function(d) {return d.id;});if (obj.event === 'add') { // 添加var type = $(this).data('type');active[type] && active[type].call(this);}else if(obj.event === 'release'){ //批量发布doRelease({ids: ids});return false;}else if(obj.event === 'remove'){ //批量撤下doRemove({ids: ids});return false;}else if(obj.event === 'del'){ //批量删除doDel({ids: ids});return false;}else if(obj.event === 'LAYTABLE_EXPORT'){ // 导出var loadIndex = layer.load();exportExcelUrl = "{:url('admin/home/top_export')}?cdate="+$('input[name=cdate]').val()+"&in_revert="+$('select[name=in_revert]').val()+"&cur_status="+$('select[name=cur_status]').val()+"&field="+orderField+"&type="+orderBy;layer.close(loadIndex);}});/* 删除 */function doDel(obj) {layer.confirm('确定要删除选中的数据吗?', {title: '删除数据',skin: 'layui-layer-admin',btn: ['<i class="layui-icon"></i>确定', '<i class="layui-icon">ဆ</i>取消'],shade: 0.5,shadeClose: true,}, function(i) {layer.close(i);var loadIndex = layer.load();$.post("{:url('admin/home/top_del')}", {id: obj.data ? obj.data.id : '',ids: obj.ids ? obj.ids.join(',') : ''}, function(res) {layer.close(loadIndex);if (res.code === 1) {layer.msg(res.msg, {icon: 1});insTb.reload();} else {layer.msg(res.msg, {icon: 5,anim: 6});}}, 'json');});}/* 表格头工具栏点击事件 */table.on('toolbar(roleTable)', function(obj) {var checkRows = table.checkStatus('roleTable');var ids = checkRows.data.map(function(d) {return d.id;});if (obj.event === 'add') { // 添加var type = $(this).data('type');active[type] && active[type].call(this);}else if(obj.event === 'release'){ //批量发布doRelease({ids: ids});return false;}else if(obj.event === 'remove'){ //批量撤下doRemove({ids: ids});return false;}else if(obj.event === 'del'){ //批量删除doDel({ids: ids});return false;}else if(obj.event === 'LAYTABLE_EXPORT'){ // 导出var loadIndex = layer.load();exportExcelUrl = "{:url('admin/home/top_export')}?cdate="+$('input[name=cdate]').val()+"&in_revert="+$('select[name=in_revert]').val()+"&cur_status="+$('select[name=cur_status]').val()+"&field="+orderField+"&type="+orderBy;layer.close(loadIndex);}});

layUI 表格

   //表格排序事件table.on('sort(roleTable)', function(obj) {// console.log(obj.field); //当前排序的字段名// console.log(obj.type); //当前排序类型:desc(降序)、asc(升序)、null(空对象,默认排序)// console.log(this); //当前排序的 th 对象//获取排序后的表格数据// console.log($('input[name=bill_no]').val());//当前排序字段orderField=obj.field;//当前排序方向orderBy=obj.type;//表格排序insTb.reload({where: {part_id:$('select[name=part_id]').val(),worker_id:$('select[name=worker_id]').val(),plan_type:$('select[name=plan_type]').val(),plan_title:$('input[name=plan_title]').val(),plan_date:$('input[name=plan_date]').val(),plan_item:$('input[name=plan_item]').val(),plan_memo:$('input[name=plan_memo]').val(),cdate:$('input[name=cdate]').val(),field:orderField,type:orderBy},// page: {//     curr: 1// },url: "{:url('oa/workplan/serach')}"});return false;});

layUI 表格

<!-- 表格操作列 -->
<script type="text/html" id="roleTbBar"><input name="id" id="id" type="hidden" value="{{d.id}}" /><a class="layui-btn layui-btn-xs" lay-event="edit" data-type="edit"><i class="layui-icon">&#xe642;</i>编辑</a>{{#  if(d.cur_status == 1){ }}<a class="layui-btn layui-btn-xs layui-bg-blue" data-type="release" lay-event="release"><i class="layui-icon">&#xe63c;</i>发布</a>{{#  } else { }}<a class="layui-btn layui-btn-xs layui-bg-blue" data-type="remove" lay-event="remove"><i class="layui-icon">&#xe609;</i>撤下</a>{{#  } }}<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</a>
</script>

layUI 表格

<!-- 表格状态列 -->
<script type="text/html" id="userTbState"><input type="checkbox" name="is_index" lay-filter="userTbStateCk" value="{{d.id}}" lay-skin="switch" lay-text="是|否" {{d.is_index==1?'checked':''}} style="display: none;" /><p style="display: none;">{{d.is_index==1?'是':'否'}}</p>
</script>{field: 'is_index',title: '是否首页显示',templet: '#userTbState',align: 'center',width: 150},/* 修改状态 */form.on('switch(userTbStateCk)', function(obj) {var loadIndex = layer.load();$.post("{:url('admin/trade_news/edit_state_same')}", {id: obj.elem.value,status: obj.elem.checked ? 1 : 0}, function(res) {layer.close(loadIndex);if (res.code === 1) {layer.msg(res.msg);insTb.reload();} else {layer.msg(res.msg, {icon: 5,anim: 6});$(obj.elem).prop('checked', !obj.elem.checked);form.render('checkbox');}}, 'json');});