Easyui Datagrid rownumbers行号四位、五位显示不完全的解决办法

第一种：扩展方法

代码：
$.extend($.fn.datagrid.methods, {
fixRownumber : function (jq) {
return jq.each(function () {
var panel = $(this).datagrid(“getPanel”);
//获取最后一行的number容器,并拷贝一份
var clone = $(“.datagrid-cell-rownumber”, panel).last().clone();
//由于在某些浏览器里面,是不支持获取隐藏元素的宽度,所以取巧一下
clone.css({
“position” : “absolute”,
left : -1000
}).appendTo(“body”);
var width = clone.width(“auto”).width();
//默认宽度是25,所以只有大于25的时候才进行fix
if (width > 25) {
//多加5个像素,保持一点边距
$(“.datagrid-header-rownumber,.datagrid-cell-rownumber”, panel).width(width + 5);
//修改了宽度之后,需要对容器进行重新计算,所以调用resize
$(this).datagrid(“resize”);
//一些清理工作
clone.remove();
clone = null;
} else {
//还原成默认状态
$(“.datagrid-header-rownumber,.datagrid-cell-rownumber”, panel).removeAttr(“style”);
}
});
}
});

调用:
$(“#table_id”).datagrid({
url : encodeURI(‘…/product.do?method=productPriceQuery&searchCondition=’+JSON.stringify(s)),
onLoadSuccess : function () {
$(this).datagrid(“fixRownumber”);
},
columns : [[
{
field : ‘PRODUCT_CODE’,
title : ‘商品编码’,
align : ‘center’,
width : $(this).width() * 0.15
},
{
field : ‘PRODUCT_NAME’,
title : ‘商品名称’,
align : ‘center’,
width : $(this).width() * 0.25
}
]]
});
把table_id替换为自己页面里实际的表格id即可。

第二种方法：直接设置行号栏的宽度,修改了样式，临时解决方案

.datagrid-header-rownumber,.datagrid-cell-rownumber{
width:40px;
}