jquery - jqgrid 将纪元日期值显示为错误日期？

Question

当服务器将日期存储为纪元时间时，日期似乎未正确呈现。 jqrid 格式使用“u”或“U”，但它不会在网格上呈现正确的日期。

我在 Fiddler 创建了演示:http://jsfiddle.net/SalesforceDev/duooa5oy/2/

$(function () {
    "use strict";
    var mydata = [
        { 
            data: 1489449600000, 
            status: "OPEN"
        }, 
        { 
            data: 1489449600000, 
            status: "ENTERED"
        }];

    $("#grid").jqGrid({
        data: mydata,
        colModel: [
            { name: 'act', template: "actions" },
            { 
                name: 'data', 
                editrules: { required: true },
                formatter: 'date',
                formatoptions: {
                    srcformat: 'u',
                    newformat: 'd/m/Y H:i'
                },
                editable: true, 
                editoptions: {
                    dataInit: function (el) {
                        $(el).datetimepicker({
                            locale: 'en-GB',
                            //debug: true,
                            widgetPositioning: {
                                horizontal: 'auto',
                                vertical: 'auto'
                            },
                            widgetParent: '#outer'
                        });
                        // fix position of the datetimepicker
                        $(el).bind("dp.show", function () {
                            var $datepicker = $("#outer .bootstrap-datetimepicker-widget");
                            if ($datepicker.length > 0) {
                                $datepicker.css("top",
                                    this.getBoundingClientRect().top +
                                    window.pageYOffset +
                                    $(this).outerHeight());
                            }
                        });
                    }
                }
            },
            {
                name: 'status',
                width: 180
            }
        ],
        iconSet: "fontAwesome",
        guiStyle: "bootstrap",
        hoverrows: false,
        pager: true   
    });
    //
    $("#show-date").text("1489449600000 ==>"+(new Date(1489449600000)));
});

更新1 当我尝试以下 fotmatter 选项时，网格停止渲染并抛出异常。演示:http://jsfiddle.net/SalesforceDev/duooa5oy/3/

        formatter: function (cellval, opts) {
            var date = new Date(cellval);
            opts = $.extend({}, $.jgrid.formatter.date, opts);
            return $.fmatter.util.DateFormat("", date, 'd-M-Y', opts);
        },

chrome 上的异常(exception):

Uncaught TypeError: Cannot read property 'DateFormat' of undefined
    at HTMLTableElement.formatter (VM317:111)
    at HTMLTableElement.d.formatter (jquery.jqgrid.src.js:3369)
    at aa (jquery.jqgrid.src.js:2276)
    at HTMLTableElement.parseDataToHtml (jquery.jqgrid.src.js:2334)
    at HTMLTableElement.Z (jquery.jqgrid.src.js:3926)
    at L (jquery.jqgrid.src.js:4404)
    at HTMLTableElement.ca (jquery.jqgrid.src.js:4476)
    at HTMLTableElement.<anonymous> (jquery.jqgrid.src.js:5787)
    at Function.each (VM312 jquery.min.js:2)
    at r.fn.init.each (VM312 jquery.min.js:2)
    at r.fn.init.b.fn.jqGrid (jquery.jqgrid.src.js:2505)
    at HTMLDocument.<anonymous> (VM317:101)
    at j (VM312 jquery.min.js:2)
    at k (VM312 jquery.min.js:2)

更新3

现在使用格式u1000之后，但是当您提交保存操作并从网格行的对象读取日期时给出了错误的日期!

查看演示:https://jsfiddle.net/SalesforceDev/duooa5oy/12/

Answer 1

对于如下日期，使用 srcformat: 'u' 是正确的

var mydata = [
    { 
        data: 1489449600, 
        status: "OPEN"
    }, 
    { 
        data: 1489449600, 
        status: "ENTERED"
    }];

(参见 http://jsfiddle.net/duooa5oy/9/ )。

如果您想使用

var mydata = [
    { 
        data: 1489449600000, 
        status: "OPEN"
    }, 
    { 
        data: 1489449600000, 
        status: "ENTERED"
    }];

相反，您应该使用srcformat: 'u1000'。查看修改后的演示https://jsfiddle.net/duooa5oy/8/ .

更新:我发布了 the bug fix到 GitHub，如果使用 srcformat: 'u1000'，它可以解决编辑日期的问题。演示https://jsfiddle.net/OlegKi/duooa5oy/14/使用 GitHub 上的最新代码，现在可以正常工作。