javascript - 导出 Kendo Grid 时 footerTemplate 显示 html 字符串？

Question

我有带有 footerTemplate 的剑道网格。我已成功将此网格导出为 Excel。但导出的 Excel footerTemplate 显示 html 字符串。

示例网格列:

           {
                field: "January",
                title: "January",
                aggregates: ["sum"],
                filterable: false,
                resourcename: "january",
                type: "currency",
                footerTemplate: function (data) {
                    return "<div style='white-space:initial;float:right'>" + kendo.toString(data.January.sum, "n0") + "</div>";
                }
            }

图片:

问题: 如何解决这个 html 字符串问题？

谢谢......

Answer 1

确保您的dataSource包含 sum aggregate 在您希望获得 sum 的列上运行函数的:

dataSource: {
  data: [
    { item: "AB", january: 12.24 },
    { item: "CD", january: 22.23 }
  ],
  aggregate: [
    { field: "january", aggregate: "sum" }        
  ]
}

然后声明你的 footerTemplate 在您希望显示值的列上:

columns: [
  { field: "item" },
  { field: "january",
    type: "currency",
    footerTemplate: "Sum: #: sum #"
  }
]

完整的 Dojo 工作示例 here .

编辑 - 右对齐 footerTemplate 中的内容

网格:

footerTemplate: "<div style='text-align: right'>Sum: #: sum #</div>"

Excel 导出 - 包括以下内容 excelExport 网格定义中的函数:

excelExport: function(e) {
    var rows = e.workbook.sheets[0].rows;

    for (var ri = 0; ri < rows.length; ri++) {
      var row = rows[ri];

      if (row.type == "group-footer" || row.type == "footer") {
        for (var ci = 0; ci < row.cells.length; ci++) {
          var cell = row.cells[ci];
          if (cell.value) {                
            cell.value = $(cell.value).text();
            // Set the alignment
            cell.hAlign = "right";
          }
        }
      }
    }
  }

hAlign 是设置为对齐文本的属性，但是如果使用 Kendo 版本 2015.3/更新版本，则此属性已被弃用，因此请使用 textAlign 相反。

我还更新了 Dojo example以反射(reflect)这些变化。