【ITOO技术篇】——jQuery easyui 中datagrid时间无法正常显示

·写在前面

　　前期的ITOO真是让人欣喜让人忧。但是既然决定要做下去，那遇到多少问题都不能轻易的放弃。遇见问题，解决问题。这是我们经常说的一句话，那我们就看一下我们遇到的问题吧。

·问题

　　　时间无法正常显示总是显示一串数字效果如下图所示。

　　

·解决办法

    我们在js中增加了一个方法。用来转换字符串叫做formatDatebox。实现如下

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.pattern("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;
}

·使用方法

　　在使用的时候就在相应的视图页引入该js。在参数转换的时候调用该方法。比如：

     

        var startDate1 =  formatDatebox(rows[0].StartDate);     
        var endDate1 = formatDatebox(rows[0].EndDate);

· 总结

　  有时候我们需要站在巨人的肩膀上，上面的JsonToDateTime是从师父哪里拿来的。用起来也很方便。有了这么多大牛的支持，这个小小问题很快就解决了。感谢您的来访！