经过源码的分析,需要变化宽度的有有个地方,一个是表头的宽度,另一处是表身的宽度。
表头的宽度取决定性作用的是tr.datagrid-header-row 下的div.datagrid-header-rownumber 这个标签。然后修改只需要在renderRow 方法里面修改几行代码就行,我用的是easyui 1.3.5版本的 可能其他版本略微有区别,但我认为区别不会大的,希望以下代码对你有用
renderRow : function(_698, _699, _69a, _69b, _69c) {
// 修改处1
var _self = $.data(_698, "datagrid");
// 修改处2
var opts = _self.options;
var cc = [];
if (_69a && opts.rownumbers) {
var _69d = _69b + 1;
if (opts.pagination) {
_69d += (opts.pageNumber - 1) * opts.pageSize;
}
// 修改处3
var _69dWidth = 25 + Math.max(String(_69d).length - 4, 0)*6 + "px";
// 修改处4
_self.dc.header1.find(".datagrid-header-rownumber").width(_69dWidth);
// 修改处5
cc
.push("<td class='datagrid-td-rownumber'><div style='width:"+_69dWidth+"' class='datagrid-cell-rownumber'>"
+ _69d + "</div></td>");
}
主要变化的有上面五处地方
分享到:
相关推荐
JS EasyUI DataGrid动态加载数据
EasyUI DataGrid过滤用法实例
解决EasyUIdataGrid列比较多,无数据,列展现不全
easyUI datagrid 自动调整行号大小
easyui datagrid中实现上下左右、回车切换单元格easyui datagrid中实现上下左右、回车切换单元格easyui datagrid中实现上下左右、回车切换单元格
easyui datagrid editor回车切换单元格示例,适合熟悉easyui但又不懂如何做的人员,可能参考一下源码JS。
EasyUI Datagrid 中文排序的问题 解决了WEB端和后台(Oracle、MySQL)中文排序问题
两种方法将easyui datagrid 中的数据导出到Excel中,均以验证可以正常使用
一个update扩展方法 文档中一种是比较笨的方法 一次只能修改一个列而且受列编辑类型影响(比如number datetime)扩展一次编辑多列,不受编辑类型影响,没有编辑属性也可以。
jquery easyui 扩展 datagrid 自定义动态隐藏显示列
jquery easyui demo 网页下载下来打包了,还有datagrid简要说明
jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) Demo 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件,源码奉献!!!
easyui datagrid 多条件筛选 可复选 过滤 例如过滤200-300 500-600 类似淘宝筛选 但允许复选
easyui datagrid 导出到excel,图解
datagrid添加tooltip及超出宽度添加省略号
在easyui 的datagrid编辑状态下实时更新其他处于编辑或者没在编辑下的列值,并在结束编辑后得到的row的数据为更改后的数据。
easyui datagrid 嵌套datagrid form 简单提交 ,刷新子表数据
easyui datagrid+SSH集成项目问题总结,史上最清楚的讲解
在Easyui的1.3.3版本中,作者新增了tooltip组件,尽管样式看起来也不咋的,但是终归也是官方出品,同时其功能也算是比较丰富。之前我写过一篇《扩展:datagrid鼠标经过提示单元格内容》那就是用纯编码生成的tip,更为...
修改上一个资源版本中结束编辑时combobox显示问题. 1、类型为combogrid时每行的参数不同查询返回对应的数据结果。 2、类型为combobox时,输入框显示图标按钮,实现... 3、解决类型为combobox显示为value而不是text问题