easyui datagrid 响应式问题
打算做个如果是PC端登陆,我可以显示全部列,手机或平板登陆,显示部分列表。
曾经想过两种方案
一.给列添加CSS
但是找不到相应的内容可以控制整一列
二.使用js控制隐藏
1.调用隐藏方法
2.重置datagrid
但是感觉两种方法都不太好弄,所以想问能不能用css控制,或怎么控制,希望方法不要太复杂。
实现图片如下:


曾经想过两种方案
一.给列添加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控制,或怎么控制,希望方法不要太复杂。
实现图片如下:


...全文
相关推荐
easyui datagrid标题列宽度自适应
NULL 博文链接:https://wusuobuai.iteye.com/blog/1860496
EasyUI中的可编辑DataGrid实现与应用
EasyUI是一个基于jQuery的前端框架,它为开发者提供了一整套丰富的组件,以便快速构建功能强大、界面友好的Web应用程序。本章将带您入门EasyUI,了解其核心理念和如何快速开始使用它。EasyUI的DataGrid组件提供了强大的列定制功能,允许开发者自定义每列的表现形式和功能。通过columns配置项,用户可以定义列的标题、字段映射、宽度、对齐方式、显示内容的模板、是否可编辑、是否可排序等多种属性。除了默认的文本输入框外,EasyUI还支持自定义编辑器类型。
EasyUI datagrid、tree右键与window弹出层综合应用
EasyUI 是一套基于 jQuery 的用户界面插件集合,它允许开发者以最小的代价实现各种常见界面的交互效果,而无需复杂的编程。EasyUI 的目标是为 Web 应用提供一套快速、简易、响应式的界面解决方案。它包含了诸如 Datagrid、Tree、Window 等丰富的组件,每个组件都旨在解决特定的用户界面需求。EasyUI的Datagrid组件是一个用于显示和操作数据的强大工具。初始化Datagrid首先需要在HTML页面中定义一个<table>元素,并为其添加属性。
EasyUI-1.Datagrid 数据网格
http://blog.csdn.net/gxy1317/article/details/52423825
EasyUI效果参考
在web开发中,非常实用。效果非常好看,做出来的页面非常吸引人的。


