如何获得ExtJs中的行标题功能？

我想呈现像描述如下：如何获得ExtJs中的行标题功能？

+-----------------+------------+---------------+ 
|     | Column 1 | Column 2 | 
+------------------------------+---------------+ 
| Row Header 1 | ...  |    | 
+------------------------------+---------------+ 
| Row Header 2 |   |    | 
+------------------------------+---------------+ 
| Row Header 3 |   |    | 
+----------------------------------------------+

我的理解，实现列标题的方式，有很多可用的文件也是如此。例如http://docs.sencha.com/extjs/4.2.3/extjs-build/examples/build/KitchenSink/ext-theme-neptune/#grouped-header-grid

但我不能得到一个有行标题。如何从Jason文件中获取并呈现与行和列属性相对应的数据？

来源

2014-09-25 Snehal Masne

因此，网格将有三列：

columns:[{ 
    dataIndex:'rowHeader' 
},{ 
    text:'Column 1', 
    dataIndex:'column1' 
},{ 
    text:'Column 2', 
    dataIndex:'column2' 
}]

，并从商店与模型加载数据fields:['rowHeader','column1','column2']

这会，如果它是一个JSON店，预计该数据将由服务器以格式提交给他

{success:true,data:[ 
    {rowHeader:'RowHeader 1',column1:'',column2:''}, 
    {rowHeader:'RowHeader 2',column1:'',column2:''}, 
    {rowHeader:'RowHeader 3',column1:'',column2:''} 
]}

如果要显示以其他格式出现的数据，例如常用于稀疏矩阵格式：

{rowHeader:'RowHeader 1',columnHeader:'ColumnHeader 1',value:''}, 
{rowHeader:'RowHeader 2',columnHeader:'ColumnHeader 1',value:''}, 
{rowHeader:'RowHeader 3',columnHeader:'ColumnHeader 1',value:''}, 
{rowHeader:'RowHeader 1',columnHeader:'ColumnHeader 2',value:''}, 
{rowHeader:'RowHeader 2',columnHeader:'ColumnHeader 2',value:''}, 
{rowHeader:'RowHeader 3',columnHeader:'ColumnHeader 2',value:''}, 
{rowHeader:'RowHeader 1',columnHeader:'ColumnHeader 3',value:''}, 
{rowHeader:'RowHeader 2',columnHeader:'ColumnHeader 3',value:''}, 
{rowHeader:'RowHeader 3',columnHeader:'ColumnHeader 3',value:''}

，你必须将数据手动转换成上述格式，因为ExtJS的电网只是不能处理不具有每行一个记录任何格式。

如果你想知道如何使细胞的rowHeader看起来像头：

基本上，它归结为定义tdCls，也可能渲染器，在列。你可能想看看API文档在http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.column.Column-cfg-tdCls和http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.column.Column-cfg-renderer

然后，有在http://skirtlesden.com/articles/styling-extjs-grid-cells

来源

2014-09-25 12:41:16 Alexander

在我的情况下，列将被动态加载，这意味着我们不知道它们有多少，因此无法修复Json文件中的字段。但你的回答仍然给了我一些方向，我可以用它来渲染东西。非常感谢！ – 2014-09-26 10:05:29

如果您也对如何处理之前评论中提到的场景有所了解，那将会很棒。 – 2014-09-26 10:07:47

亚历山大，请在这里回答相关问题：http://stackoverflow.com/questions/28342132/how-to-have-headers-in-first-column-instead-of-regular-headers-in-top-row – 2015-02-05 10:57:53

该如何风格的ExtJS网格单元格指南如果您还没有一个固定的JSON结构，你将不得不发送一个模式。我会建议使用即时可用的json格式，用于grid.reconfigure。

{"schema":[{dataIndex:'t1',name:'T1'}],"data":[{t1:'Val'},{t1:'Valo'}]}

现在，你就不会这样把之前加载到店直接，但使用Ext.Ajax.request，然后准备商店（只需创建一个新的从架构中的字段）和电网（grid.reconfigure(columns,store)）数据使用store.loadRawData进入商店。

来源

2014-09-26 11:00:43 Alexander