Easyui Datagrid的Rownumber行号显示问题

Easyui Datagrid的Rownumber行号显示问题在Oracle中使用orderby进行查询排序时,如果排序字段中有空值(null),排序结果可能会达不到我们想要的结果。如:select*fromtestorderbyagedesc;按照age字段降序排序,结果如下:将sql语句改为select*fromtestorderbyagedescnullslast;即可将null值排到

大家好,又见面了,我是你们的朋友全栈君。

Datagrid中当你的行数据超过9999时,第一列的行号rownumber将会因为表格内容过长而导致无法显示全部数字,
这一点Easyui无法做到自适应 所以需要进行修改,这里扩展一个方法就行了。

$.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");
            }
        });
    }
});

将上述代码添加到easyui源码当中即可

然后在你的$(“#dg”).datagrid()中添加onLoadSuccess事件

$("#dg").datagrid({
    onLoadSuccess : function () { 
   
        $(this).datagrid("fixRownumber");
    }
});

作者:itmyhome

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/131269.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • pycharm2022.01.13怎么激活_在线激活[通俗易懂]

    (pycharm2022.01.13怎么激活)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容https://javaforall.cn/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~1PA3AFINM4-eyJsaWNlb…

  • Datagrip2021.8.3激活码【中文破解版】[通俗易懂]

    (Datagrip2021.8.3激活码)最近有小伙伴私信我,问我这边有没有免费的intellijIdea的激活码,然后我将全栈君台教程分享给他了。激活成功之后他一直表示感谢,哈哈~IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.cn/100143.htmlS3…

  • python判断linux中文件是否存在_Python判断文件是否存在的三种方法

    python判断linux中文件是否存在_Python判断文件是否存在的三种方法通常在读写文件之前,需要判断文件或目录是否存在,不然某些处理方法可能会使程序出错。所以最好在做任何操作之前,先判断文件是否存在。这里将介绍三种判断文件或文件夹是否存在的方法,分别使用os模块、Try语句、pathlib模块。1.使用os模块os模块中的os.path.exists()方法用于检验文件是否存在。判断文件是否存在importosos.path.exists(test_file.txt…

  • windows查看tomcat版本信息

    windows查看tomcat版本信息tomcat提供了查看版本信息的bat工具,

  • 深度学习: RPN (区域候选网络)

    深度学习: RPN (区域候选网络)Overview绿框内为RPN所在的位置:放大之后是这样:庖丁解牛RPN由以下三部分构成:在RPN头部,通过以下结构生成anchor(其实就是一堆有编号有坐标的bbox):论文中的这幅插图对应的就是RPN头部:(曾经以为这张图就是整个RPN,于是百思不得其解,走了不少弯路。。。)在RPN中部,分类分支(cls)和边框回归分支(b…

  • ListView之多种类型Item

    ListView之多种类型Item一、概述一般而言,listview每个item的样式是一样的,但也有很多应用场景下不同位置的item需要不同的样式。拿微信举例,前者的代表作是消息列表,而后者的典型则是聊天会话界面。本文重点介绍

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号