想必用过EasyUI的朋友们都应该会遇到这样的情况吧:(下图)

在EasyUI中DataGrid中如果要显示DateTime的时间时候,便会显示上图这样的格式,很明显,这里的格式不会是我们想要的,我们想要的就大概如2014-10-30 13.29之类的才人性话,从数据库后台传过来的是一个DateTime类型,却显示成这样。

对这个时间分析后,无意中发现,这个括号里面的不就是Unix时间戳吗?,那我们把这个时间戳转一下不就行了??于是我写了一个js方法,把传入的字符串(Unix时间戳)转成我们想要的时间格式。

function getTime(/** timestamp=0 **/) {
var ts = arguments[0] || 0;
var t, y, m, d, h, i, s;
t = ts ? new Date(ts * 1000) : new Date();
y = t.getFullYear();
m = t.getMonth() + 1;
d = t.getDate();
h = t.getHours();
i = t.getMinutes();
s = t.getSeconds();
// 可根据需要在这里定义时间格式
return y + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d) + ' ' + (h < 10 ? '0' + h : h) + ':' + (i < 10 ? '0' + i : i) + ':' + (s < 10 ? '0' + s : s);
}

然后在DataGrid中的时间这一项加入一个formatter 格式器来对其格式进行格式化。

{ field: 'Title', title: '标题', width: 500 },
{ field: 'Author', title: '作者', width: 100 },
{
field: 'CreateTime', title: '发布时间', width: 100,
formatter: function (date) {
var pa = /.*\((.*)\)/; //获取 /Date(时间戳) 括号中的字符串时间戳 的正则表达式
var unixtime = date.match(pa)[1]; //通过正则表达式来获取到时间戳的字符串
return getTime(unixtime);
}
},

按照上面的写法,应该是没问题的了,于是再次运行效果图如下:

奇怪了,怎么还不是我们想要的格式呢,那个js函数目测是没有问题的,如果有问题的话便应该是那个根本就不是unix时间戳,但是这个字符串也太类似了吧,而且即使前面的年份出了问题,那后面的时间都是很正确的啊,和数据库的基本符合,于是打开网页通过站长工具的unix时间戳转化网站来确定下这个字符串到底是什么

图中可以看到基本就是unix时间戳,只是后面多了几个数字,不懂到底是什么,不过竟然那么接近的话,我直接把它后面的几个截去不就行了吗,最后发现这个方法的确可行/嘻嘻~~~~,于是最后的DataGrid的格式化器便这样写了

formatter: function (date) {
var pa = /.*\((.*)\)/;
var unixtime = date.match(pa)[1].substring(0,10);
return getTime(unixtime);
}

通过substring来截取前面的10个数字,组成的字符串便是我们想要的unix时间戳了,阴差阳错,竟然就这么给我答对了,于是结果便成了我们想要的时间数据

尽管处理方法还有很多,这是只是我想到的处理方法,也不是很复杂,现在的EasyUI应该是能够智能的做到这一步了吧,上面过去getTime的js函数,可以通过Extend扩张到jquery中使用,这样就不需要再每个使用到这个方法的页面都写一次,重构了代码,希望这里的这个能帮到一些也遇到这种情况的朋友一点点提示。

EasyUI 的DataGrid中DateTime的格式化问题的更多相关文章

  1. easyui datagrid中datetime字段的显示和增删改查问题

    datagrid中datetime字段的异常显示: 使用过easyui datagrid的应该都知道,如果数据库中的字段是datetime类型,绑定在datagrid显式的时候会不正常显示,一般需要借 ...

  2. 在EasyUI的DataGrid中嵌入Combobox

    在做项目时,须要在EasyUI的DataGrid中嵌入Combobox,花了好几天功夫,在大家的帮助下,最终看到了它的庐山真面: 核心代码例如以下: <html> <head> ...

  3. EasyUI DataGrid 中字段 formatter 格式化不起作用

    今天用 EasyUI datagrid 来做列表,要对一些数据进行格式化,推断某字段状态时,发现 formatter 格式化相应的函数不起作用. <table id="list_dat ...

  4. hibernate左连接查询时在easyUI的dataGrid中有些行取值为空的解决办法

    1 当使用left join左连连接,sql语句为 select t from SecondPage t left join t.rightNavbar n where 1=1 页面中出现了部分空行的 ...

  5. EasyUI 解决 datagrid 中 NumberBox 限制小数位数后不能输入小数点问题

    初始化界面,发现编辑datagrid,不能输入小数点. var arrColumnsCNT = [[ { title: '毛重', field: 'GrossWeight', halign: 'cen ...

  6. EasyUI获取DataGrid中某一列的所有值

    function count() { var rows = $('#dg'').datagrid('getRows')//获取当前页的数据行 var total = 0; for (var i = 0 ...

  7. easyui获取datagrid中的某一列的所有值

    function getCol(){ var rows = $("#dg").datagrid("getRows"); var total = "&q ...

  8. easyui datagrid 中序列化后的日期格式化

    1.在easyui datagrid 中序列化后的日期显示为:/Date(1433377800000)/ 2.格式化后的显示为: 2015-06-04 08:30:00 3.使用代码如下: 3.1. ...

  9. EasyUI实现图片的上传后与其他文本框的提交以及DataGrid中图片的展示

    图片即文件,在jsp中文件上传很简单,一个type为file的input,一个form指定enctype为multipart/form-data,通过post提交到后台利用apache的commons ...

随机推荐

  1. 使用cordova+Ionic+AngularJs进行Hybird App开发的环境搭建手冊

    一.所需工具 1,JDK:生成 2.安卓SDK开发环境 3,NodeJs:主要使用的还是npm 4,Python开发环境 5.VS 2012(2008,2015也能够,已亲測):安装这个主要是须要一些 ...

  2. 虚拟机中Lvs配置

    参考:http://zh.linuxvirtualserver.org/node/272 环境,三台centos 5.2.基于ipvsadm的负载均衡,采用DR方式,负载均衡的服务是web. 内核版本 ...

  3. Excel 信息对比_数组版

    Sub LOOKUP_UChur() Dim i As Long '=== sourceWorksheet = 数据源表名称 Dim sourceWorksheet As Worksheet Dim ...

  4. 【BZOJ3120】Line 矩阵乘法

    [BZOJ3120]Line Description Wayne喜欢排队……不对,是Wayne所在学校的校长喜欢看大家排队,尤其是在操场上站方阵.某日课间操时,校长童心大发想了一个极具观赏性的列队方案 ...

  5. 3、二、c# 面向对像编程。类,结构、C# 数据类型(引用类型、值 类型、指针类型)、ref参数与out参数、方法的重载、静态类型与静态成员、继承与多态、委托与事件

    一.类 定义类使用class关键字. <access specifier> class class_name { // member variables 成员变量 <access s ...

  6. Apache Samza - Reliable Stream Processing atop Apache Kafka and Hadoop YARN

    http://engineering.linkedin.com/data-streams/apache-samza-linkedins-real-time-stream-processing-fram ...

  7. C#、devExpress 的 给bandedGrid加菜单功能 :复制、粘贴的例子(转)

    C#.devExpress 的 给bandedGrid加菜单功能 :复制.粘贴的例子 CopyFromGrid PasteToGrid PasteNewRowsToGrid private void ...

  8. java中日期常用

    Java中日期的几种常见操作 —— 取值.转换.加减.比较 Java 的开发过程中免不了与 Date 类型纠缠,准备总结一下项目经常使用的日期相关操作,JDK 版本 1.7,如果能够帮助大家节约那么几 ...

  9. 永久解决delphi 2010不能2次启动问题

    由于在Windows安装了最近的更新(KB2982791, KB2970228)后,Delphi的IDE需要创建的一个文件%TEMP%\EditorLineEnds.ttr会被系统锁定,导致除非重新启 ...

  10. java基础04 Scanner的使用

    import java.util.Scanner; /** * 所有在java.lang包下面的所有类 不需要显示的引入包! * java.util.Scanner : 想获取用户的输入 必须引入相关 ...