easyui datagrid 响应式问题

Javon9276 2015-06-19 10:35:18
打算做个如果是PC端登陆,我可以显示全部列,手机或平板登陆,显示部分列表。

曾经想过两种方案

一.给列添加CSS

但是找不到相应的内容可以控制整一列

二.使用js控制隐藏

1.调用隐藏方法


$('#loginLogTable').datagrid('hideColumn', 'id');
$('#loginLogTable').datagrid('hideColumn', 'ip');


2.重置datagrid


var loginLogTableParams = {
sortName: 'login_time',
sortOrder: 'desc',
fitColumns: true,
columns: [
[
{field: 'id', title: '登陆日志ID', sortable: true, align: 'center', width: 100},
{field: 'account', title: '工号', sortable: true, align: 'center', width: 100},
{field: 'name', title: '用户名', sortable: true, align: 'center', width: 100},
{field: 'ip', title: '登陆IP', sortable: true, align: 'center', width: 100},
{field: 'login_time', title: '登陆时间', sortable: true, align: 'center', width: 100},
{field: 'out_time', title: '登出时间', sortable: true, align: 'center', width: 100}
]
]
};


var loginLogTableParams = {
sortName: 'login_time',
sortOrder: 'desc',
fitColumns: true,
columns: [
[
{field: 'id', title: '登陆日志ID', sortable: true, align: 'center', width: 100, hidden: true},
{field: 'account', title: '工号', sortable: true, align: 'center', width: 100},
{field: 'name', title: '用户名', sortable: true, align: 'center', width: 100},
{field: 'ip', title: '登陆IP', sortable: true, align: 'center', width: 100, hidden: true},
{field: 'login_time', title: '登陆时间', sortable: true, align: 'center', width: 100},
{field: 'out_time', title: '登出时间', sortable: true, align: 'center', width: 100}
]
]
};


但是感觉两种方法都不太好弄,所以想问能不能用css控制,或怎么控制,希望方法不要太复杂。

实现图片如下:

...全文
169 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
hch126163 2015-06-19
  • 打赏
  • 举报
回复
不同设备 用不同模板
Javon9276 2015-06-19
  • 打赏
  • 举报
回复
怎么没有人啊,最近问问题都没有人回答了。
kl172 2015-06-19
  • 打赏
  • 举报
回复
初始页面时可以 var isHidden = 如果是手机端?true:false; ... {field: 'id', title: '登陆日志ID', sortable: true, align: 'center', width: 100, hidden: isHidden}, ...
Javon9276 2015-06-19
  • 打赏
  • 举报
回复
引用 2 楼 hch126163 的回复:
不同设备 用不同模板
这样就不符合我的需求的。

87,884

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧