数据表格2:自定义显示字段的样式bug
Created by: gtcfla
动态更新dataSource里面的cols,能实现显示隐藏,但是隐藏掉的字段列样式没有相应地对应上,比如隐藏的字段宽度都是按隐藏后的字段列,新增显示的占用这个隐藏列后显示就变形,还有就是隐藏后,存在空的列等等的问题。(修改了源码的一个地方解决了一个报错问题)
通过F12缩放后,页面显示正常,文档没找到解决方法,重新渲染也不行。部分代码如下: var _cols = [ {name: 'action', label: '操作', width: 150, valueType: 'action', html: true}, {name: 'game_mark', label: '游戏简码', width: 150}, {name: 'aid', label: 'aid', width: 150}, {name: 'roleid', label: '角色ID', width: 100}, {name: 'uid', label: '平台账号UID', width: 100}, {name: 'rolename', label: '角色名', width: 100}, {name: 'level', label: '角色等级', width: 80}, {name: 'vip_level', label: 'VIP等级', width: 80}, {name: 'sid', label: '区服ID', width: 80}, {name: 'sname', label: '区服名', width: 80}, {name: 'device', label: '设备号', width: 200}, {name: 'ip', label: 'IP', width: 120}, {name: 'channel', label: '聊天频道', width: 100}, {name: 'msg', label: '聊天内容', html: true}, {name: 'status', label: '状态', width: 160}, {name: 'ctime', label: '时间', width: 150} ]; function custom_display() { var checkbox = []; $("input[type='checkbox']").each(function () { var info = this.value; if(this.checked){ checkbox[info] = info; } }); cols = [{name: 'action', label: '操作', width: 150, valueType: 'action', html: true}]; _cols.forEach(function(value, index){ if (checkbox[value.name]){ cols.push(value); } }); var myDataGrid = $('#datagridPageExample').data('zui.datagrid'); myDataGrid.dataSource.cols = cols; myDataGrid.search(new Date().getTime()); myDataGrid.render(); }