如何在 MVC 应用程序中转置 Kendo UI 网格中的行和列？

Question

我在我的 MVC 应用程序中使用 Kendo Ui Grid。 我希望在我的网格中显示多个国家的统计数据。从数据库中检索数据的方式，我的网格会显示如下数据：

Country    Area       Population    GDP      GDP Growth
India      3288000    1220200000    1.848    6.8
USA        9827000    314686189     15.09    1.7

但不是上面的格式，我希望它显示如下：

Country          India         USA            
Area             3288000       9827000        
Population       1220200000    314686189
GDP              1.848         15.09    
GDP Growth       6.8           1.7      

我怎样才能实现这种换位？

Answer 1

如果有人偶然发现此问题，最重要的是您需要设置td 属性display: block 和tr - display: inline-block。 td 他们将彼此重叠，tr 将彼此相邻。

    #grid .k-grid-header { float: left; padding: 0 !important; }
    #grid .k-grid-content { width: 1000px; height: 300px !important}
    #grid table {width: auto; white-space: nowrap; }
    #grid tr { display: inline-block; }
    #grid thead tr { display: inline; }
    #grid th, #grid td { display: block; border: 1px solid black; height: 30px; padding:15px;}

正在工作dojo fiddle。