当前位置 : 主页 > 网络编程 > JavaScript >

easyui datagrid 行数超出无法显示完整数字

来源:互联网 收集:自由互联 发布时间:2021-06-30
easyui datagrid fix rownumber width $.extend($.fn.datagrid.methods, { //datagrid中当你的行数据超过9999时,第一列的行号rownumber将会因为表格内容过长而导致无法显示全部数字 fixRownumber: function (jq) { re
easyui datagrid fix rownumber width
$.extend($.fn.datagrid.methods, {
       //datagrid中当你的行数据超过9999时,第一列的行号rownumber将会因为表格内容过长而导致无法显示全部数字
        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");
                }
            });
        }
    });
网友评论