easyui中的datagrid使用起来,确实还是挺轻巧方便,但是其中也有不少的问题,尤其遇到客户的一些特殊的需求时往往实现得不是很好。这个时候就需要我们自己动手来修改easyui的源码了。easyui的源码我也稍有阅读,其中的设计方式确实是相当巧妙,但是给人最大的感受是源码中的变量方法名都是用的没有意义的数字和字母,这对于阅读源码确实比较的麻烦。
说了这么多,直入主题吧,我们最近在给某保险公司做一个财务系统,因为是财务系统,就得经常用到列表,而且财务会计他们要求的列表格式又是相当的苛刻。前不久,客户就发现我们开发的列表,内容和标题要么都居中,要么都居左居右,这让客户觉得十分的不爽。因为他们用Excel标题都是居中的,文字内容可能居左,数字一般居右。
这个需求,一提出来,我们试着到网上去查,但是查到这方面的解决方案基本上也不能解决问题。于是组长就让我放下手头的工作,着手解决这个问题。没有办法,只能硬着头皮去读easyui的源码。经过一个下午的研究,发现之所以datagrid标题和内容对齐方式一样,肯定有个地方来设置标题或者内容的对齐方式。功夫不负有心人,终于找到了设置对齐方式的代码。
// 因为默认的标题对齐方式是跟内容对齐方式是一样的,因为代码写在这里
cell.css("text-align",(col.halign||col.align||""));
从上面的代码可以看出标题的居中方式,跟内容的对齐方式是一样的,如何解决呢。我们不能将对齐方式写死在源码中,必须要能在column中设置。相当于给columns中加上一个属性,这就好办了。
// 标题居中字段
cell.css("text-align",col.titleAlign||"center");
//在field中设置
{field:'SUBJECT_ID',title:'科目代码',width:100,align:'center',col.titleAlign: true,sortable:true}
就这样,我们就给field加上了一个属性,并且用这个属性来控制datagrid按照我们的想法工作,这给了我们一个修改easyui源码的思路。
下一篇:datagird数字排序问题
easyui中datagrid标题居中内容居左实现方式的更多相关文章
-
EasyUI中Grid标题居中方法(jquery实现方法)
$(".panel-title").css("text-align", "center"); 一句话搞定,就是这么随意
-
easyui中datagrid空数据集不刷新的解决方式
datagrid空间可以异步请求json数据,并将新数据覆盖原有数据,重绘数据表. 但是当回来空数据集的时候,js会产生这样一条错误: TypeError: rows is null for(var ...
-
dojo表格内容居左、居中和居右
1.常规表格内容居左.居中和居右 style="text-align:left;" style="text-align:center;" style=" ...
-
2016word多级列表 一级标题居中后偏左
一.如下图所示,定义好多级列表之后设置标题,但是发现标题居中后偏左. 二.选择多级列表,设置居左对齐
-
EasyUI 中 DataGrid 控件 列 如何绑定对象中的属性
EasyUI 中 DataGrid 控件 是我们经常用到的控件之一, 但是 DataGrid 控件 在绑定显示列时却不支持对象属性绑定. 模型如下: public class Manager impl ...
-
EasyUI中datagrid的基本用法
EasyUI中datagrid是最常用的一个控件了,现在整理一下datagrid的基本语法,先展示下页面效果吧,如下图
-
EasyUI中datagrid双击事件
EasyUI中datagrid双击事件 在jsp文件底部增加代码: <script type="text/javascript"> //数据表双击事件 $('#tabl ...
-
css设置图片居中、居左、居右
CreateTime--2017年12月8日14:25:09 Author:Marydon css设置图片居中.居左.居右 图片一般默认是居左显示的,如何更改它的水平位置呢? <div st ...
-
easyUI中datagrid展示对象下属性以及显示多个子属性(Day_37)
easyUI中datagrid展示对象下属性以及显示多个子属性 显示对象单个属性值 添加formatter属性 <th field="decidedzone" width=& ...
随机推荐
-
OAF_开发系列16_实现OAF与XML Publisher整合
http://wenku.baidu.com/link?url=y2SFKHP5qqn4bl_iNeqLGjXsTvhyFuhkMraIbWZdTXbzcv0vTefrZFFBDWie0cAAKuTw ...
-
Android adb 命令使用总结
adb原理 参考文档 How ADB works http://www.cnblogs.com/ifantastic/p/5186362.html http://blog.csdn.ne ...
-
安装VS2015出现的bug,各位安装请注意
昨天微软发布了vs2015 迫不及待的下载下来安装体验了一把,但是机器上同时安装有vs2010.vs2012.vs2013 .安装完成后,因为公司项目需要开发,打开vs2012 ,有如下提示: 百度查 ...
-
算法之旅,直奔<;algorithm>;之十四 fill_n
fill_n(vs2010) 引言 这是我学习总结<algorithm>的第十四篇,作为fill的亲兄弟,fill_n也会助你一把的. 作用 fill_n 的作用是给一段指定长度的数据向量 ...
-
使用Web Audio API绘制音波图
摘要:Web Audio API是对<audio> 标签功能上的补充,我们可以用它完成混音.音效.平移等各种复杂的音频处理,本文简单的使用其完成音波图的绘制. PS:本例子使用ES6编程, ...
-
asp.net mvc 简单项目框架的搭建(二)—— Spring.Net在Mvc中的简单应用
摘要:上篇写了如何搭建一个简单项目框架的上部分,讲了关于Dal和Bll之间解耦的相关知识,这篇来把后i面的部分说一说. 上篇讲到DbSession,现在接着往下讲. 首先,还是把一些类似的操作完善一下 ...
-
mysql -- 逻辑语句
1.if语句 delimiter \\ create procedure p1() begin declare i ; then ; elseif i = then ; else ; end if; ...
-
[MySQL]在安装windows版MySQL时遇到过如下问题Error Nr.1045和Error.Nr.2003,相应解决办法如下
1.准备mysql server-5.0.27.exe 2.按照指导安装,在安装到最后一步时遇到如下两个错误: 2.1.出现错误Error Nr.1045 解决办法: a).停止MySQL服务:我的电 ...
-
delphi Image处理
procedure ImageDrawText(ATextEdo: IGGCCADTextEDO); var oImageBitmap: TBitmap; x1,x2,y1,y2: double; b ...
-
Python 在序列上跟踪索引和值
内置的enumerate() 函数可以很好的解决这个问题 >>> my_list = ['a', 'b', 'c'] >>> for idx, val in enu ...