ExtJs 4:如何动态隐藏/显示网格列?

时间:2013-12-26 21:46:43

标签: extjs4

我需要动态显示/隐藏网格的列,但似乎ExtJs 4没有实现的方法。

在以前的版本中,我应该使用columnModel,它不再存在。

只需获取grid.columns[index]hide()show()不会影响网格。

使用grid.columnManaget.getColumns()[index].hide()可以真正隐藏列,但无法再次显示(因为getColumns()之后不会返回该列)。

4 个答案:

答案 0 :(得分:10)

以下内容应该有效:

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    id: 'simpsons',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    height: 200,
    width: 400,
    renderTo: Ext.getBody(),
    dockedItems:[{
        xtype:'button',
        handler: function() {
            if(Ext.getCmp('simpsons').columns[0].isVisible())
                Ext.getCmp('simpsons').columns[0].setVisible(false);
            else
                Ext.getCmp('simpsons').columns[0].setVisible(true);
        }
    }]
});

答案 1 :(得分:3)

访问“你的网格”,然后

yourGrid.columnManager.getColumns()[index].setVisible(false);

如果需要的话 - EXT 4

parent.doLayout();

EXT 6

parent.updateLayout();

答案 2 :(得分:2)

以下内容应该有效:

Ext.getCmp('simpsons').down('[dataIndex=ColumnName]').setVisible(false);

答案 3 :(得分:0)

Ext.getCmp('gridId').columnManager.getColumns()[index].hide();
Ext.getCmp('gridId').doLayout();

这对我有用