Question

我们正在使用jqxgrid在屏幕上显示房间信息。为了便于阅读，我们尝试将日期格式化为“今天”或“明天”而不是实际日期（今天或明天......）。

除了重新格式化为“今天”和“明天”之外，一切正常（网格显示应有的一切）。我们尝试使用moment.js，但不知何故它不起作用。

这是我们的来源：

 datatype: "json",
        datafields: [
            {name: 'title', type: 'string'},
            {name: 'room_name', type: 'string'},
            {name: 'room_number', type: 'string'},
            {name: 'start', type: 'date', format: "yyyy-MM-dd HH:mm"},
            {name: 'end', type: 'date', format: "yyyy-MM-dd HH:mm"},
            {name: 'email', type: 'string'},
            {name: 'comment', type: 'string'}

            ...

  $("#jqxgrid").jqxGrid(
        {
        columns: [
                {text: 'Raum #', dataField: 'room_number', width: 120},
                {text: 'Raum-Name', dataField: 'room_name', width: 340},
                {text: 'Von', dataField: 'start', width: 190, cellsalign: 'center', cellclassname: "startdate"},
                {text: 'Bis', dataField: 'end', width: 190, cellsalign: 'center', cellsformat: 'dd.MM'},
                ....

注意：gridcell“VON”中的输出如下所示： 2014年8月28日星期四16:30:00 GMT + 0200（CEST）

如您所见，开始日期包含在div-class startdate中。

我们通过javascript尝试重新格式化它：

$(document).ready(function() {
    function formatDate(date) {
        date.each(function(){
            var formattedDate = $(this).text();
            var d = moment(formattedDate);
            $(this).html( d.format("dddd, MMMM Do"));

        });
};

formatDate($('.startdate'));
});

当我们在一个外部 jqxgrid的div上使用它时，这非常有效。但是，它并不适用于它。有什么想法吗？

更新：这就是诀窍：

 window.setTimeout(function(){
            console.log($('.startdate div').innerHTML);
            formatDate($('.startdate div'));
        }, 2000);

后来生成div，正如gp正确陈述的那样。无论如何，可能有更好的解决方案吗？

Answer 1

您可以将格式化调用添加到网格的就绪函数中：

$("#jqxgrid").jqxGrid(
    {
        columns: [ ... ],
        ready: function() {
            formatDate($('.startdate'));   
        },
        ....
    });

Answer 2

在调用formatDate之前，您需要确保在网格中生成div（.startdate）。

最好是使用jqxgrid的“初始化”事件。

$('#jqxgrid').on('initialized', function () {
    formatDate($('.startdate div'));
});

格式显示日期＆＃34;今天＆＃34; /＆＃34;明天＆＃34;而不是JqxGrid中的Month-Day

2 个答案: