EasyUI datagrid : 启用行号、固定列及多级表头后,头部行号位置单元格错位的问题

症状如图:

上图中,行号列与checkbox 列融合了。解决方法是在datagrid 的 onLoadSuccess 事件中加入如下代码:

  var opts = $(this).datagrid(‘options‘);
                if(opts.rownumbers){
                    var dgPanel = $(this).datagrid(‘getPanel‘);
                    var tdRownumber = dgPanel.find(‘.datagrid-header-rownumber‘).parent();
                    var hasFrozenColumns = $(this).datagrid(‘getColumnFields‘,true);
                    if(hasFrozenColumns.length){
                        var dgView2 = dgPanel.find(‘.datagrid-view2‘);
                        var trCount = dgView2.find(‘.datagrid-header tr‘).length;

                        tdRownumber.attr(‘rowspan‘,trCount);
                    }
                }

  

时间: 2024-11-10 13:58:06

EasyUI datagrid : 启用行号、固定列及多级表头后,头部行号位置单元格错位的问题的相关文章

【EasyUi DataGrid】动态加载列

动态加载列可以说是一个从无到有的过程,如果只是网页上的DataGrid实现那就太无味了,有趣的在这里,这个页面上连带着一大堆的数据库表的查询修改,尤其是做着做着发现数据表设计有缺陷,需要的数据竟然只有出口没有入口,想想也是醉了,对业务不熟悉真心的杀不起啊.这个其实蛮好玩的,就像玩捉迷藏藏得那个人叫做nothing,再后来我又遇到了Multiple-births(多胞胎),一个页面上涉及到了六七张数据库表,里边的字段名虽然不一样,可它就是达到了百分之七八十的相似度,多亏咱是上过学的,欺负不了我读书

jquery easyui datagrid 在翻页以后仍能记录被选中的行及刷新设置选中行数据

//easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行://注意datagrid中需要配置idField属性,一般为数据的主键 $.ajax({ type: 'GET', url:url, async:false, success: function (dt) { var grid = $('#list'); grid.datagrid('reload');//刷新表格数据 grid.datagrid({ onLoadSuccess:function(){ grid.

jquery easyui datagrid 如何第一次点击列标题时是降序排列

使用 fnOnBeforeLoad在发回到服务器查询之前,修改排序和对应的图标样式. 1.配置 data-options='onBeforeLoad:fnOnBeforeLoad'. 2.对应的函数: function fnOnBeforeLoad(a,b){             if(a.sort=="Date"){//设置Date字段 第一次排序为倒序              var order=(a.order=="asc"?"desc&quo

python DataFrame获取行数、列数、索引及第几行第几列的值

print df.columns.size#列数 2 print df.iloc[:,0].size#行数 3 print df.ix[[0]].index.values[0]#索引值 0 print df.ix[[0]].values[0][0]#第一行第一列的值 11 print df.ix[[1]].values[0][1]#第二行第二列的值 121 df=DataFrame([{'A':'11','B':'12'},{'A':'111','B':'121'},{'A':'1111','B

easyUi dataGrid 行高设置,解决错行问题

在easyUi dataGrid中,如果使用了frozenColumns和columns,如果行高不一样,可以选择其中的一个格式化一下高度即可. 代码 columns : [ [ { title : '备注', field : 'memo', width : 150, styler : function(value,row,index){ return 'height:30px'; } }] ] 原文地址:http://blog.51cto.com/1197822/2157015

jquery easyui datagrid 分页 详解

前些天用jquery easyui的table easyui-datagrid做分页显示的时候,折腾了很久,后来终于解决了.其实不难,最主要我不是很熟悉前端的东西. table easyui-datagrid分页 有一个附加的分页控件,只需后台获取分页控件自动提交的两个参数rows(每页显示的记录数)和page(当前第几页)然后读取相应页数的记录,和总记录数total一块返回即可. 1.界面 2.前端代码 <table id="dg" title="文章管理"

初识 easyui datagrid

首先应该下载好easyui datagrid所用的各种js 和css 这个可以到官网上去下载. 首先要引入datagrid所引入的js和css. <script src="js/jquery.min.js"></script><script src="js/jquery.easyui.min.js"></script><link rel="stylesheet" type="text

jQuery EasyUI DataGrid API 中文文档

扩展自$.fn.panel.defaults,用 $.fn.datagrid.defaults重写了 defaults . 依赖 panel resizable linkbutton pagination 用法 1.  <table id="tt"></table> 1.  $('#tt').datagrid({ 2.      url:'datagrid_data.json', 3.      columns:[[ 4.          {field:'co

easyui datagrid使用参考

数据表格 继承$.fn.panel.defaults,使用$.fn.datagrid.defaults重载默认值. 依赖关系 控制面板 缩放 链接按钮 分页 使用方法 <table id="tt"></table> $('#tt').datagrid({ url:'datagrid_data.json', columns:[[ {field:'code',title:'Code',width:100}, {field:'name',title:'Name',wi