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

Posted 2023-05-07

【中文标题】使用剑道网格中的属性格式化字符串

【英文标题】：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 元素的属性来完成的。我发布了一个解决方案作为答案。

【参考方案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");
  
);