easyui datagrid 日期时间显示不正常,
原因: 后台Java 类型为 DATE 经过JSON工具转化后传到前台来就乱了
两种思路: 1: 还没进行json处理之前就给专程string
2. 到了前台再转回来。
解决方案一:
- {field:'issueTime',title:'生效时间',
- formatter:function(value,row,index){
- var unixTimestamp = new Date(value);
- return unixTimestamp.toLocaleString();
- }
- },
解决方案二:
为了克服数据中时间为空的情况,我们可以考虑使用前台js解析返回的json数据。
第一步、我们先定义一个方法,使日期列正常显示,js代码如下:
- function formatDatebox(value) {
- if (value == null || value == '') {
- return '';
- }
- var dt;
- if (value instanceof Date) {
- dt = value;
- }
- else {
- dt = new Date(value);
- if (isNaN(dt)) {
- value = value.replace(/\/Date (−?\d+) \//, '$1'); //标红的这段是关键代码,将那个长字符串的日期值转换成正常的JS日期格式
- dt = new Date();
- dt.setTime(value);
- }
- }
- return dt.format("yyyy-MM-dd"); //这里用到一个javascript的Date类型的拓展方法,这个是自己添加的拓展方法,在后面的步骤3定义
- }
- $.extend(
- $.fn.datagrid.defaults.editors, {
- datebox: {
- init: function (container, options) {
- var input = $('').appendTo(container);
- input.datebox(options);
- return input;
- },
- destroy: function (target) {
- $(target).datebox('destroy');
- },
- getValue: function (target) {
- return $(target).datebox('getValue');
- },
- setValue: function (target, value) {
- $(target).datebox('setValue', formatDatebox(value));
- },
- resize: function (target, width) {
- $(target).datebox('resize', width);
- }
- }
- });
- Date.prototype.format = function (format)
- {
- var o = {
- "M+": this.getMonth() + 1, //month
- "d+": this.getDate(), //day
- "h+": this.getHours(), //hour
- "m+": this.getMinutes(), //minute
- "s+": this.getSeconds(), //second
- "q+": Math.floor((this.getMonth() + 3) / 3), //quarter
- "S": this.getMilliseconds() //millisecond
- }
- if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
- (this.getFullYear() + "").substr(4 - RegExp.$1.length));
- for (var k in o) if (new RegExp("(" + k + ")").test(format))
- format = format.replace(RegExp.$1,
- RegExp.$1.length == 1 ? o[k] :
- ("00" + o[k]).substr(("" + o[k]).length));
- return format;
- }
- function initTable(queryData) {
- $('#test').datagrid({ //定位到Table标签,Table标签的ID是test
- fitColumns: true,
- url: '/OperationLog/QueryLog', //指向后台的Action来获取当前用户的信息的Json格式的数据
- title: '日志信息查询', //标识
- iconCls: 'icon-save',
- height:335,
- nowrap: true,
- autoRowHeight: false,
- striped: true,
- collapsible: true,
- pagination: true,
- rownumbers: true,
- //sortName: 'ID', //根据某个字段给easyUI排序
- //sortOrder: 'asc',
- remoteSort: false,
- //idField: 'number',
- queryParams: queryData, //异步查询的参数
- columns: [[
- { title: '操作人', field: 'userID',sortable: true,},
- { title: '操作类型', field: 'operatorType', sortable: true, },
- { title: '档案人姓名', field: 'userName', sortable: true, },
- { title: '操作时间', field: 'operatorTime', formatter: formatDatebox, editor: 'datebox', sortable: true, width: 10, }
- ]],
- });
- }
- </script>
我最后是这么做的:
{field:'kkny',title:'开考年月',width:150,formatter:function(value,row,index){
var unixTimestamp = new Date(value);
return unixTimestamp.toLocaleString();
}}
function datetoLocal(value){
var unixTimestamp = new Date(value);
var year = unixTimestamp.getFullYear();
var month= unixTimestamp.getMonth()+1;
var day = unixTimestamp.getDate()+1;
var hours = unixTimestamp.getHours()+1 ;
var minutes = unixTimestamp.getMinutes()+1 ;
var seconde = unixTimestamp.getSeconds()+1;
var result = year+"-"+month+"-"+day +" "+hours+":"+minutes+":"+seconde;
return result;
}