簡體   English   中英

包含動態數據的Kendo網格列

[英]Kendo grid columns with dynamic data

需要有關Kendo Grid的幫助,在Kendo Grid中有動態列。

dynamicCols- Object是具有標題和值屬性列表的對象,該屬性可以是動態的,在列表中可以包含標題,值對的任意數量的對象。

如果JSON具有扁平結構且所有屬性都處於同一級別,則Kendo網格效果很好,並且到目前為止,我還沒有遇到過這種層次結構/ JSON結構。

該網格還需要使用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

您有兩種選擇:

  • 完成獲取數據后,在創建新的Grid之前,請解析JSON對象並創建Grid接受的平面列對象
  • 您的第二個選擇是忘記創建動態列的想法,而是使用一個模板列來動態解析其需要顯示的內容。 在這種情況下,您將創建可從模板調用的外部函數。 這樣,您最終就不會得到復雜而笨拙的模板。 如何調用外部函數從模板覆蓋這里

對我來說,最簡單的解決方案是制作所有列,然后通過隱藏不需要的列來結束它。

即使隱藏約50列也不會花費任何明顯的時間。

(我很榮幸知道所有可能出現的列)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM