jqgrid显示Epoch日期值为错误的日期?

时间:2017-03-15 01:48:13

标签: jquery jqgrid free-jqgrid

当服务器将其存储为纪元时间时,似乎未正确呈现日期。 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上的例外:

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/

上的演示

enter image description here

1 个答案:

答案 0 :(得分:0)

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的最新代码,现在可以正常工作。