使用剑道网格中的属性格式化字符串答案

【问题标题】：Formatting strings using attributes in kendo grid使用剑道网格中的属性格式化字符串
【发布时间】：2014-08-30 02:24:04
【问题描述】：

我想知道是否可以使用“属性：{}”来格式化字符串（在这种情况下是显示在字段 OrderDate 中的字符串）（我不知道我应该怎么称呼它。一个标签？一个财产？）

注意：这是在从远程服务器获取 JSON 数据的 kendogrid 内部。

注意 2：attributes:{style:text-align:center;"} 工作正常。

        field : "OrderDate",
        title : "Orderdatum",
        attributes:{style:"text-align:center;"},
        width : 170,

如果还有什么需要我提供给你的，一定要说出来。

提前谢谢大家！如果这看起来像我没有搜索过或其他什么，那么我可以向你保证我有。

我认为这可能有助于人们了解它的外观。在我的情况下，我想要实现的是，如果数据是3-3-2009（选定的单元格/行），它显示为03-03-2009。是否可以使用attributes 实现它？

再次感谢您。

编辑 2： This link 告诉我在 CSS3 中是不可能的。所以我现在的猜测是我accidently 创建了一个duplicate question。所以让我重新表述我的问题：我如何格式化字符串，不一定使用属性，所以它看起来像我解释的我想要它的样子？

编辑 3： 我应该包括这个。如您所见，我得到的是 string 而不是 number。

schema: {
            type : "json", 
            data : "SalesOrders.SalesOrder", 
            model: {
                fields: {
                    OrderNo : {type: "string"},
                    OrderDate : {type: "string"},
                    DeliveryWeek : {type: "number"},
                    OrderTotal :  {type: "number"},
                    OBJECTID : {type: "number"},
            },

再次感谢您抽出宝贵时间阅读我的问题。

【问题讨论】：

重新格式化 HTML 元素的值不是通过 HTML 元素的属性来完成的。我发布了一个解决方案作为答案。

标签： css kendo-ui string-formatting

【解决方案1】：

在这种情况下，您无法使用 CSS3 格式化字符串（就像完全不可能...）

因此，您需要在 JSON 对象加载后对其进行格式化，然后再将其传递到网格中进行显示。

数据格式（此链接让您了解如何格式化数据源）

http://www.telerik.com/forums/datasource-number-format

格式化日期（此链接让您了解如何格式化日期）

http://docs.telerik.com/kendo-ui/getting-started/framework/globalization/dateformatting

如果您对日期的剑道格式不满意（是的，我讨厌它），您可以使用 sweet momentJS

http://momentjs.com/

顺便说一句（已编辑）

Kendo grid date column not formatting

这是使用“模板”属性进行格式化的一种更快捷、更简洁的方式

【讨论】：

感谢您的帮助，但它根本没有帮助。一个是因为我完全不知道如何格式化 JSON 数据（不是在阅读了您包含的链接之后，因为第一个是 numbers 而第二个是 dates 而我有string 。）第二，我不希望使用模板，因为这需要我完全重建网站，这并不好玩。但是仍然感谢您的回答，因为我确实了解了有关格式化数字和日期的更多信息，并且我已经将其用于其他部分！

【解决方案2】：

我们可以结合功能（在以下 Kendo UI 文档中描述）在 DataBound 事件期间重新格式化日期：

http://docs.telerik.com/kendo-ui/getting-started/framework/globalization/dateformatting

http://docs.telerik.com/kendo-ui/api/web/grid#events-dataBound

[更新] 这里有一些通用代码来传达这个想法：

<div id="grid"></div>
<script>
    $("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ],
  dataBound: function(e) {
    console.log("put your Date conversion logic here in the dataBound event");
  }
});

【讨论】：