在Kendo UI Grid中将UNIX时间戳格式化为人类日期的正确方法是什么?

时间:2013-08-02 23:59:14

标签: date kendo-ui timestamp kendo-grid unix-timestamp

好吧似乎有很多类似的问题,但没有一个我可以找到回答这个具体问题..所以这里就是..

有一个有效的Kendo UI网格。我的数据源正在返回一个时间戳 - 这是返回代码的JSON响应:

enter image description here

你会注意到下一行也是一个日期..由MySQL作为标准的DateTime格式返回 - 我很乐意直接使用它。但是我把日期转换成了一个我认为会更普遍的时间戳。 (??)

现在我需要做两件事 - 将时间戳格式化为可读日期并编辑日期,以便将其保存回数据源。但是我们先解决格式问题。

我目前显示列的代码如下所示:

    {   title: "Trial<br>Date", 
    field: "customer_master_converted_to_customer_date",
    format: "{0:d/M/yyyy}",
    attributes: {
        style: "text-align: center; font-size: 14px;"
    },
    filterable: true,
    headerAttributes: {
        style: "font-weight: bold; font-size: 14px;"
    }
},

虽然我试过..

    toString(customer_master_converted_to_customer_date, "MM/dd/yyyy")

..以及其中的几种变体 - 就格式字符串而言。是的,我尝试过进入:

    type: "date",

无论我做什么,我都只得到时间戳。

enter image description here

任何?

3 个答案:

答案 0 :(得分:3)

首先需要convert时间戳到JavaScript日期。以下是一个示例实现:

$("#grid").kendoGrid({
  dataSource: {
    data: [
      { date: 1371848019 }
    ],
    schema: {
      model: {
        fields: {
          date: {
            type: "date",
            parse: function(value) {
              return new Date(value * 1000);
            }
          }
        }
      }
    }
  }
});

这是现场直播:http://jsbin.com/utonil/1/edit

答案 1 :(得分:0)

谢谢@Atanas Korchev,这对我有用,这就是我最终要做的事情:

// in datasource
    schema:{
      model: {
        fields: {
          date: { type: "date",
                    parse: function(value) {
                      return new Date(value);
                    }
          }, // … other fields

    // in columns
    columns: [
        {
          field: "date",
          title: "Date",
          type: "date",
          format: "{0:dd MMM yyyy}"
        },
        // ... other columns
     ]

答案 2 :(得分:0)

将数据库中的时间戳格式数据用于 KendoGrid 的最简单方法。

https://stackoverflow.com/a/67106362/5671943

<kendo-grid-column class="CreatedAt" field="CreatedAt" title="title"
 [width]="120" [headerStyle]="{'background-color': '#36455a','color': '#fff'}"
 [style]="{'background-color': '#36455a','color': '#fff'}">
      <ng-template kendoGridCellTemplate let-dataItem>
         {{dataItem.CreatedAt | date:"yyyy/MM/dd HH:mm:ss"}}
      </ng-template>
</kendo-grid-column>
相关问题