0

所以我在这里有工作视图,可以很好地创建我的网格。

Ext.define('AM.view.user.List' ,{
    extend: 'Ext.grid.Panel',
    alias: 'widget.userlist',
    title: '<center>Results</center>',
    store: 'User', 
    dockedItems: [{
        xtype: 'toolbar',
        dock: 'bottom',
        items: [
            { xtype: 'tbtext',  text: 'Loading...', itemId: 'recordNumberItem'  },
            '->',
            { text: 'Print', itemId: 'print' },
            '-',
            { text: 'Export', itemId: 'export' }
        ]
    }],
    initComponent: function() {
        this.columns = [
            {header: 'Name',  dataIndex: 'name', flex: 4, tdCls: 'grid_cell'},
            {header: 'ID', dataIndex: 'ID', flex: 2, tdCls: 'grid_cell'},
            {header: 'Mid Name', dataIndex: 'mid_name', flex: 3, tdCls: 'grid_cell'},
            {header: 'Last Name', dataIndex: 'last_name', flex: 4, tdCls: 'grid_cell'},
            {header: 'Address', dataIndex: 'adress', flex: 3, tdCls: 'grid_cell'}
        ];
        this.callParent(arguments); //Calls the parent method of the current method in order to override 

        var store = this.getStore(); //Retrieving number of records returned
            textItem = this.down('#recordNumberItem');
            textItem.setText('Number of records: ' + store.getCount());

            //var val = Ext.getCmp('criteria_1').getValue();
            //store.filter('ID', val); 

    }   
});

我想将网格中的每一行转换为可扩展和可折叠,就像在 Sencha Docs 下的行扩展器中显示的那样:http ://docs.sencha.com/extjs/4.2.1/#!/example/build/KitchenSink /ext-主题-海王星/

我尝试添加插件,但无法使其正常工作。有任何想法吗?

4

2 回答 2

3

像这样使用插件配置:

Ext.define('AM.view.user.List',{
   extend: 'Ext.grid.Panel',
   //other configs
   plugins: [{
      ptype: 'rowexpander',
      rowBodyTpl: ['{field}']
   }]
});

请参阅jsFiddle 上的工作示例。此外,Sencha Docs 在右侧提供了一个“代码预览”面板,显示他们使用的代码。

我在这个答案中读到你不能在 initComponent 中配置插件,尽管当 rowexpander 仍然是 ux 时,这是针对 ExtJS 4.1 的。我不确定它在 4.2 中的相关性。

于 2013-08-07T19:26:44.710 回答
2

这已经很晚了,但对于任何需要另一行的人来说:

Ext.define('AM.view.user.List',{
   extend: 'Ext.grid.Panel',
   //other configs
   plugins: [{
      ptype: 'rowexpander',
      rowBodyTpl: ['<p><b>Field 1:</b> {field1}</p><br>',
                   '<p><b>Field 2:</b> {field2}</p>']
  }]
});
于 2016-08-31T20:42:36.587 回答