DataGrid——行高不起作用

问题1:rowStyler 设置行高不起作用:

在 DataGrid 组件中,提供了 rowStyler 函数,用于设置行的css 样式,但是实践发现,对于height设置不起作用。跟踪代码发现如下:

function _58b(trs1,trs2){
for(var i=0;i<trs2.length;i++){
var tr1=$(trs1[i]);
var tr2=$(trs2[i]);
tr1.css("height","");
tr2.css("height","");
var _591=Math.max(tr1.height(),tr2.height());
tr1.css("height",_591);
tr2.css("height",_591);
}
};

在1.4版本中位于7855行。

将一下两行注释掉即可:

tr1.css("height","");
tr2.css("height","");

问题2:使用上述方法之后,行高只对内容区域起作用,对表头仍然不起作用,这是因为 rowStyler  函数只是在绑定数据的时候生成新行的时候被调用,在初始化,生成表头的过程中没有被调用。

解决方法如下:

在调用 datagrid 函数初始化之后,调用如下方法:

function setHeaderHeight(divGrid,height) {
    divGrid.find(".datagrid-view").find("tr").css("height", height);
    var view = divGrid.find(".datagrid-view");
    var tr1 = view.find(".datagrid-view1").find(".datagrid-htable .datagrid-header-row");
    var tr2 = view.find(".datagrid-view2").find(".datagrid-htable .datagrid-header-row");
    _58b(tr1, tr2);
    function _58b(trs1, trs2) {
        for (var i = 0; i < trs2.length; i++) {
            var tr1 = $(trs1[i]);
            var tr2 = $(trs2[i]);
            var _591 = Math.max(tr1.height(), tr2.height());
            tr1.css("height", _591);
            tr2.css("height", _591);
        }
    };
}

其中 divGrid为表格的div容器的jquery对象。height则为‘20px‘类似的样式。

时间: 2024-12-07 15:18:50

DataGrid——行高不起作用的相关文章

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

怎样设置easyui中datagrid行高

$('#face_table2').datagrid({            title: '信息',            iconCls: 'icon-save',   url: 'callroll!page.action'   nowrap: true,                      //设置为true,当数据长度超出列宽时将会自动截取.   striped: true, //显示条纹   pageList: [5,15,30],    fitColumns: false, 

理解css行高(line-height)

首先我们要明确 line-height 的定义,line-height指的是两条文字基线之间的距离. 行内框盒子模型 所有内联元素的样式表现都与行内框盒子模型有关.所以这个概念是非常重要的. <p>这是一段文字,这里有个<em>em</em> 标签.</p> 如上面一段普普通通的代码,却包含了4种盒子: 1)“内容区域”(content area),是一种围绕文字看不见的盒子,可理解为选中文字蓝色背景区域,如下图.“内容区域”的大小与 font-size 大

wpf datagrid row height 行高自动计算使每行行高自适应文本

wpf 的datagrid的行高 要么是Auto,要么是定值:但会带来麻烦就是每行行高都一样. 当需要按内容(主要是wrap 换行的textbox或textblock)来动态调整行高的时候,需要用到dataGrid的LoadingRow 事件. 参考两个网页: http://stackoverflow.com/questions/9264398/how-to-calculate-wpf-textblock-width-for-its-known-font-size-and-characters

【转】css行高line-height的一些深入理解及应用

一.前言 前两天在腾讯ISD团队博客上看到一篇翻译的文章“深入理解css 行高”,是个不错的文章,学到了不少东西,建议您看看. 这里,我也要讲讲我对line-height的一些理解,所讲解的东西绝大多数与上面提到的“深入理解css 行高”是不重复的,可以说是补充或是另外一个角度的思考.另外,将结合实际,展示line-height的一些特性和一些常见应用,帮助您对css行高line-height的理解.所讲述的并不一定都是正确的,欢迎指正欢迎交流. 二.一些字面意思“行高”顾名思意指一行文字的高度

datagrid行编辑如何实现级联?

还是级联的问题,不过这一次,是在datagrid里,那么难度上肯定比form中的级联要高. 但是只要熟练掌握了datagrid的API,问题还是很容易就可以解决的. 关键点在于--editor,关于datagrid实现编辑功能全要靠它. 先实现行编辑 比如在datagrid中要实现某一列可编辑,那么需要在那一列的column中配置editor属性 editor的配置可以只指定type,也就是编辑框的类型,可以是combobox,datebox等easyUI配备的一些类型 若对这些编辑框有额外的属

CSS行高line-height解释

"行高"顾名思意指一行文字的高度.具体来说是指两行文字间基线之间的距离.基线实在英文字母中用到的一个概念,我们刚学英语的时使用的那个英语本子每行有四条线,其中底部第二条线就是基线,是a,c,z,x等字母的底边线.下图的红色线即为基线. vertical-align中有top,middle,baseline,bottom与之是由关联的 css中起高度作用的应该就是height以及line-height了吧! 如果一个标签没有定义height属性(包括百分比高度) 1.单行文字的垂直居中对

css行高line-height的一些深入理解及应用

by zhangxinxu from http://www.zhangxinxu.com,原文地址:http://www.zhangxinxu.com/wordpress/?p=384 一.一些字面意思"行高"顾名思意指一行文字的高度.具体来说是指两行文字间基线之间的距离.基线实在英文字母中用到的一个概念,我们刚学英语的时使用的那个英语本子每行有四条线,其中底部第二条线就是基线,是a,c,z,x等字母的底边线.下图的红色线即为基线. vertical-align中有top,middle

项目复习期总结3:CSS引入方式,注释,命名规范,背景,行高,文本属性

目录: 1.CSS注释的书写 怎么写?好处? 2.CSS引入方式  各种的优缺点 3.选择器的写法与选择器的优先级 4.CSS命名规范 5.背景,行高 6.文本(text与font开头)等所有属性 ① CSS注释书写规范: 1.单行注释:    直接写在属性值的后面,如: ① .search{ border:1pxsolid#fff;/*定义搜索输入框边框*/ background:url(../images/icon.gif)no-report#333;/*定义搜索框的背景*/ } ② .wr