0

我将 Kendo UI 网格绑定到填充了 xml 的数据源。

这个对我有用。

现在我想用嵌套节点的“n”多个值（逗号分隔）填充每行的一个单元格。

xml文件示例：

<product id="1">
 Microsoft Office
 <tags><tag>microsoft</tag></tags>
 </product>
<product id="1">
 Ububtu Linux
 <tags><tag>Canonical</tag><tag>OS</tag><tag>Open Source</tag></tags>
 </product>
 <product id="1">
  Windows 8
  <tags><tag>microsoft</tag><tag>OS</tag></tags>
 </product>
 </product>

我想要的结果：

ID     Product              Tags

1      Microsoft Office     microsoft
2      Ubuntu Linux         canonical, OS, Open Source
3      Windows 8            microsoft, OS

对于前 2 列没有问题：

  $("#grid").kendoGrid({
        dataSource: {
            type: "xml",
            transport: {
                read: { url: 'some_remote_xml',
                    dataType: "xml"
                }
            },
            schema: {
                type: "xml",
                model: {
                    fields: {
                        id: { field: 'product/@id', type: "number" },
                        Product: { field: 'product/text()', type: "string" } 

                    }

如何呈现“标签”列？

任何帮助将不胜感激！

4

2 回答 2

0

您可以通过以下两种方式之一执行此操作：

1）提供一个“行模板”，这里演示：http ://demos.kendoui.c​​om/web/grid/rowtemplate.html

或者

2）您可以template在网格中为您的列设置使用自定义。

对于自定义模板，您需要在网格中列出您想要的所有列，然后为template应该显示自定义信息的列提供设置。

最简单的方法是将 设置template为一个函数，该函数接收当前数据行作为参数。然后你可以.join用 a 标记,并返回它。


$("#grid").kendoGrid({
  dataSource: {
    // ... your data source here
  },

  columns: [
    {field: "id", title: "Product ID"},
    {field: "product", title: "Product Name"},
    {
      title: "Tags",
      template: function(dataRow){
        return dataRow.tags.join(", ");
      }
  ]
});

使用 KendoUI 的模板引擎可能有更好的方法来完成这项工作，但这至少会暂时显示您以逗号分隔的项目列表。

您可以在此处阅读有关列模板的信息：http: //docs.kendoui.c​​om/api/web/ grid#configuration-columns.template

于 2013-04-11T16:32:05.303 回答
0

非常感谢 Derik 和 OnaBai。

我知道解决方案可以从某种剑道模板中传递出来……但困难在于实现这样的解决方案。

我的应用程序的真实代码非常复杂。

在上面的示例中，wi 不仅会管理“标签”节点，还会管理属性等......

就像是：

  <tags>
   <tag id="1">First tag</tag>
   <tag id="2">Second tag</tag>
   ...
  </tags>

如果架构部分中的此片段返回产品 id（产品的 xml id 属性）：

id: { field: 'product/@id', type: "number" }

...这将返回产品文本（xml 文本节点）：

Product: { field: 'product/text()', type: "string" }

如何在模板中管理返回的一个或多个标签？

Tags: { field: 'product/tags' }

我必须实现一个管理“标签”子节点数组的模板。

好的。

我找到了这个解决方案：

列的模板定义：

 //pass the 'Tags' array to a javascript function
 template: '#= myfunction(Tags) #'

...然后是一个全局 javascript 函数：

function myfunction(e) {
var result = '';

//iteration on the 'tags' array
for (var i = 0; i < e.length ; i++) {
    result += '<a href="' + e[i]["@id"] + '">' + e[i]["#text"] + '</a>';

}
return result;  // now in the tags column of the grid we have the 'tags/tag' xml section   of each product, rendered as html anchor

}

效果很好！！！

我希望这对其他朋友有所帮助。

如果您认为更好或更简单的解决方案，欢迎您;-))

于 2013-04-16T11:08:04.520 回答