JQuery easyUI datagrid 远程加载数组时日期对象显示的有关问题

JQuery easyUI datagrid 远程加载数组时日期对象显示的问题
使用过JQuery easyUI的datagrid组件的朋友都知道，datagrid可以从服务器端加载集合数组显示到页面上。但java.util.Date日期类型的数据却不能像我们期待的那样，显示如‘2016-4-12’等类型的数据，只会显示‘[object]’。那么日期格式转换为指定格式的字符串的问题就需要解决了。
我接触easyUI越深，就越被它的优秀方便快捷而迷倒。当我遇到这个问题的时候，我多次百度寻求答案。然而网上的答案都‘不约而同’的一致。

比如：
easyui datagrid 中序列化后的日期格式化

我以前也是用的链接里的方法，感觉挺繁琐的。

但我今天给查看网络的时候，发现了个新大陆：远程加载集合时，对象的日期类型的属性也是一个对象。我在前台接收到的数据格式如下：

{"rows":[{
     "cal_date":{ "date":13,"day":3,"hours":0,"minutes":0,"month":2, "nanos":0,  "seconds":0,"time":1363104000000, "timezoneOffset":-480, "year":113 },
     "deal_flag_id":"3",
     "e_cost":45.9,
     "user_id":"010006712"
     },{
     "cal_date":{"date":12, "day":2,"hours":0,"minutes":0,"month":2,"nanos":0,
 "seconds":0,"time":1363017600000,"timezoneOffset":-480,"year":113},
     "deal_flag_id":"3",
     "e_cost":-46,
     "user_id":"010006712"
 }],
 "total":2
}

在集合里我的cal_date是java.util.Date类型的数据，返回到前台就成了这样的json类型↓

{"date":12,"day":2,"hours":0,"minutes":0,"month":2,"nanos":0,"seconds":0,"time":1363017600000,"timezoneOffset":-480,"year":113}

接下来就简单了啊！

只需要给cal_date字段加formatter属性：

{field : 'cal_date',title : '计费日期',width : 80,align : 'center',
				 formatter:function(value,rowData,rowIndex){
					 if(value!=null)
					 	return (value.year+1900)+'-'+(value.month+1)+'-'+(value.date);
					 else
						 return "";
				 }
			 }

就没问题啦！
O(∩_∩)O哈哈~

PS:根据这个原理，我们可以构建出不同格式的日期来显示，比如：

return (value.year+1900)+'年'+(value.month+1)+'月'+(value.date)+'日';

这个就看自己咯~

JQuery easyUI datagrid 远程加载数组时日期对象显示的有关问题

相关推荐