easyui datagrid表格解析日期，成长整型

拼搏现实的明天。 2022-08-14 05:39 190阅读 0赞

当我们的easyui datagrid 表格的日期，显示为一长串数字时,例如:144444585666,我们首先想到肯定数据从服务器返回时是否有问题。如果有问题，想办法解析即可。

但是今天遇到了个奇葩的问题，数据从服务器返回时，没有任何的问题，标准的 yyyy-MM-dd HH:mm:ss格式。但是经过

{ field:'addr',title:'所属地址',align:'center',width:'200'},
    { field:'createtime',title:'登陆时间',align:'center',width:'200'}

一解析，就出问题。显示的日期如下图所示

![这里写图片描述][20151123220344393]

如何你的问题，跟我的一样，恭喜你，你有希望了！！！！

--------------------

如何解决呢？

引入这个js。新建个js文件，把这一堆，放进去，引入到你的页面即可

function parseToDate(value) { 
        if (value == null || value == '') {
            return undefined;
        }
        var dt;
        if (value instanceof Date) {
            dt = value;
        } else {
            if (!isNaN(value)) {
                dt = new Date(value);
            } else if (value.indexOf('/Date') > -1) {
                value = value.replace(/\/Date\((-?\d+)\)\//, '$1');
                dt = new Date();
                dt.setTime(value);
            } else if (value.indexOf('/') > -1) {
                dt = new Date(Date.parse(value.replace(/-/g, '/')));
            } else {
                dt = new Date(value);
            }
        }
        return dt;
    }
    // 为Date类型拓展一个format方法，用于格式化日期
    Date.prototype.format = function(format) // author: meizz { 
        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 formatDateBoxFull(value) { 
        if (value == null || value == '') {
            return '';
        }
        var dt = parseToDate(value);
        return dt.format("yyyy-MM-dd hh:mm:ss");
    }
    function formatDatebox(value) { 
        if (value == null || value == '') {
            return '';
        }
        var dt = parseToDate(value);// 关键代码，将那个长字符串的日期值转换成正常的JS日期格式
        return dt.format("yyyy-MM-dd"); // 这里用到一个javascript的Date类型的拓展方法，这个是自己添加的拓展方法，在后面的步骤3定义
    }
    //重写datagrid方法，使datagrid行编辑时，日期控件内的时间格式正确显示：
    $.extend($.fn.datagrid.defaults.editors, {
        datebox : {
            init : function(container, options) { 
                var input = $('<input type="text">').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);
            }
        },
        datetimebox : {
            init : function(container, options) { 
                var input = $('<input type="text">').appendTo(container);
                input.datetimebox(options);
                return input;
            },
            destroy : function(target) { 
                $(target).datetimebox('destroy');
            },
            getValue : function(target) { 
                return $(target).datetimebox('getValue');
            },
            setValue : function(target, value) { 
                $(target).datetimebox('setValue', formatDateBoxFull(value));
            },
            resize : function(target, width) { 
                $(target).datetimebox('resize', width);
            }
        }
    });

最后一部：

> 使用 formatter格式化日期

{ field:'createtime',title:'登陆时间',align:'center',width:'200',formatter:formatDateBoxFull}

介绍完毕。

如有问题,请留言交流。

[20151123220344393]: /images/20220731/2a77821e997c4b90b279a81f1159c807.png

发表评论取消回复

表情：

评论列表（有 0 条评论，190人围观）

还没有评论，来说两句吧...

相关阅读

相关 EasyUI的datagrid数据表格用法

[这是官方文档][Link 1] 引入easyui所有相关的js、css文件，然后写一个表格： <table id="alldg" style="min-heig

比眉伴天荒/ 2023年07月25日 12:51/ 0 赞/ 147 阅读

相关 easyui 刷新datagrid_easyUI跨tab刷新datagrid

需要在当前页(tab)完成操作后刷新另外一个tab中datagrid的数据，然而在当前tab中获取到datagrid调用其load方法，datagrid从服务器获取到数据了，但

偏执的太偏执、/ 2022年12月31日 09:30/ 0 赞/ 247 阅读

相关 08-EasyUI_datagrid

0. 下载 1) JsonViewer json字符串格式化查看及校验工具 [Json-Viewer.zip][] 2) 此示例的项目源码源码(

╰半夏微凉°/ 2022年09月18日 09:55/ 0 赞/ 232 阅读

相关 easyui datagrid表格解析日期，成长整型

当我们的easyui datagrid 表格的日期，显示为一长串数字时,例如:144444585666,我们首先想到肯定数据从服务器返回时是否有问题。如果有问题，想办法

拼搏现实的明天。/ 2022年08月14日 05:39/ 0 赞/ 191 阅读

相关 jquery easyui DataGrid 数据表格属性

扩展自 $.fn.panel.defaults ，用 $.fn.datagrid.defaults 重写了 defaults 。依赖 panel

川长思鸟来/ 2022年08月07日 07:53/ 0 赞/ 267 阅读

相关 easyui-datagrid扩展--》对时间日期的要求

在datagrid中问我们进入行编辑模式的时候，我们想在里面加日期和时间的时候 $.extend($dategrid_time_editors,{

约定不等于承诺〃/ 2022年06月09日 04:16/ 0 赞/ 255 阅读

相关 easyUI的datagrid控件日期列格式化

转自：https://blog.csdn.net/idoiknow/article/details/8136093 EasyUI是一套比较轻巧易用的Jquery控件，在使用过

野性酷女/ 2022年05月26日 05:36/ 0 赞/ 312 阅读

相关 easyui datagrid中日期的转化

\{field:'ggdate',title:'发布日期',width:100, formatter: function(value,row,index)\

分手后的思念是犯贱/ 2022年05月22日 13:04/ 0 赞/ 228 阅读

相关 EasyUI中表格Datagrid合并单元格

“岁月无多人易老，乾坤虽大愁难著” 相信很多用过datagrid的同学都有这样的经历，就是合并单元格了。我今天也做了这个功能，在这里分享一下： ![在这里插入图片描述]

素颜马尾好姑娘i/ 2022年05月12日 15:12/ 0 赞/ 500 阅读

相关 jquery easyui datagrid columns日期格式化问题

使用easyui的datagrid，从后端返回的json字符串中的日期，直接赋值到createtime这个column时，出现了错误显示。显示的样子是：\[object O

你的名字/ 2022年04月18日 00:26/ 0 赞/ 488 阅读