具有动态数据的 Kendo 网格列答案

【问题标题】：Kendo grid columns with dynamic data具有动态数据的 Kendo 网格列
【发布时间】：2023-03-28 14:23:01
【问题描述】：

需要有关 Kendo Grid 的帮助，其中我在 Kendo Grid 上有动态列。

dynamicCols- 对象是一个具有标题和值属性列表的对象，这些属性可以是动态的，列表中可以有任意数量的具有标题、值对的对象。

如果 JSON 具有所有属性都处于同一级别的扁平结构，并且我直到现在还没有遇到过这种层次结构/JSON 结构，那么 Kendo 网格就可以很好地工作。

此网格还需要支持使用 C# Web API 的服务器端排序和过滤，以及用于服务器端排序和过滤的 Kendo Datasource API。

现有的剑道列映射

var cols = [
            { field: 'name', title: 'Name', encoded: false },
            { field: 'id', title: 'Id' },
            { field: 'age', title: 'Age }
           ]

 json = [{
            name:'XYZ', id:123, age:45,
            dynamicCols: [{title:'Gender',value:'Male'},      
                          {title:'Veteran',value:'Yes'}]
        }, {
            name:'Jim', id:555, age:24,
            dynamicCols: [{title:'Gender',value:'Male'},
                          {title:'Veteran',value:'No'}]
        }, {
            name:'Nick', id:557, age:78,
            dynamicCols: [{title:'Gender',value:'Female'},
                          {title:'Veteran',value:'No'}]
        }]

**Expected Grid**

        Name   Id   Age  Gender  Veteran
        XYZ    123  45   Male     Yes
        Jim    555  24   Male     No

对于 Json2

    json2 = [
        {name:'XYZ', id:123, age:45,
        dynamicCols: [{title:'SSN',value:'xx-xx-7891'}]
        },
        {name:'Jim', id:555, age:24,
        dynamicCols: [{title:'SSN',value:'xx-xx-7892'}]
        },
        {name:'Nick', id:557, age:78,
        dynamicCols: [{title:'SSN',value:'xx-xx-7895'}]
        }];

    **Expected Grid**

        Name   Id   Age  Gender  SSN
        XYZ    123  45   Male    xx-xx-7891
        Jim    555  24   Male    xx-xx-7892

【问题讨论】：

恐怕您的第二个 json 无效。太多了]]。

标签： javascript json asp.net-web-api kendo-ui kendo-grid

【解决方案1】：

你有两个选择：

获取数据后并在创建新 Grid 之前，解析 JSON 对象并创建 Grid 接受的平面列对象
您的第二个选择是忘记创建动态列的想法，而是使用模板列动态解析它需要显示的内容。在这种情况下，您可以创建一个可以从模板调用的外部函数。这样您就不会得到复杂而蹩脚的模板。 here 介绍了如何从模板调用外部函数。

【讨论】：

【解决方案2】：

对我来说最简单的解决方案是制作所有列，然后通过隐藏那些我不需要的列来结束它。

即使隐藏大约 50 列也不会花费太多时间。

（我有幸知道所有可能出现的潜在列）

【讨论】：