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

Posted 2023-05-07

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

【英文标题】：How to transpose rows and columns in a Kendo UI grid in MVC application?

【发布时间】：2015-12-28 00:08:06

【问题描述】：

我在我的 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      

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

【问题讨论】：

我不认为开箱即用。此外，当您的数据库中有许多国家/地区时，我可以看到严重的性能问题。

如果 Grid 是只读的（不需要编辑/删除/插入），我们可以实现它吗？

我很难想象网格的配置。我并不是说它不起作用，但如果可以，您可能需要一些认真的解决方法。您可能需要在 javascript 中完成所有操作。我首先将每个单元格的类型定义为 string（因为类型是在 column 级别定义的......）并将第一列（“Country”）设置为固定。跨度>

有什么建议可以替代剑道网格，信号器有很多列要显示？

这很好，但很假。 1 因为导出到 excel 没有转置。 2 因为当我们使用剑道网格作为另一个网格的数据源时，当用户选择单元格时（在 grid2 中显示该行和列）。这个预览实际上没有被调换。 3 grid2作为用户预览然后导出到excel然后绘制另一个amcharts（当数据有效时）。所以我们不能那样做。有没有办法通过为 coll 创建另一个数组并通过这个***.com/q/17428587/308578

转置数据来实际转置

【参考方案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。

【讨论】：

它可以工作，但在标题列下方显示内容列，而不是并排显示列。 dojo fiddle 在这里也有同样的问题。这可能是什么问题？

网格并非设计为具有水平流动。您只需要找到要覆盖的 css 属性。让你开始 - dojo.telerik.com/edajo/16

它工作正常。我对网格样式进行了细微更改，如#grid .k-grid-header float: left;填充：0！重要； #grid table 显示：块； #grid tr 显示：内联块； #grid thead tr 显示：内联； #grid th，#grid td 显示：块；溢出：隐藏；边框样式：实心；边框宽度：0 0 1px 1px；填充：.5em .6em .4em .6em；空白：nowrap；文本溢出：省略号；文本对齐：左；高度：2em；宽度：自动；字体大小：11px；

谢谢，您的 css 是在我自己的网格上进行转置的一个很好的起点。真的很惊讶剑道自然不支持这个