如何在网格中以编程方式设置列的编辑器

时间:2013-12-03 13:53:11

标签: extjs extjs4.2 extjs-grid

我有Ext.grid.Panel一组列。此网格已过滤,根据过滤器,我想为列定义编辑器。

我的网格:

Ext.define('Mb.view.MyPanel', {
    extend: 'Ext.grid.Panel',
    columns: [
        {text: 'Order #', dataIndex: 'id'},
        {text: 'Action', dataIndex: 'type',
            renderer: function(value){
                if(value == 'BP') return Lang._('Veuillez choisir')
                 return ''
            }
        },

现在我想做点什么:

var panel = Mb.app.getView('MyPanel');
if (condition == true) {
    panel.getColumns[1].setEditor({
        xtype: 'textfield',
        ...
    })
}

显然,方法getColumnssetEditor不存在。因此,我需要另一种方法来激活该列的编辑器 我没有找到一种方法来访问列定义来修改它们并在之后重新渲染网格。

你能给我一个关于搜索方向的提示吗?感谢。

1 个答案:

答案 0 :(得分:10)

Ext.grid.column.Column上查看getEditor()的文档。如果您使用的是编辑插件,该插件会为getEditor()以及setEditor()提供实施。根据正在编辑的列和您实现的任何自定义逻辑,您可以实现自定义getEditor()方法,以根据具体情况返回您想要的任何编辑器实例。

文档说:

getEditor( record, defaultField ) : Ext.form.field.Field

这真的说明了一小部分事实。

  • getEditor不仅是Ext.grid.column.Column的方法,还是配置选项。
  • 如果将getEditor定义为配置选项功能,则将其称为getEditor( record )并需要返回Ext.grid.CellEditor
  • 这适用于cellediting插件,但不适用于rowediting插件。

以下是列配置的示例。它只会在选定的行上创建一个组合框:

columns: [{
    text: 'Action', dataIndex: 'action', 
    getEditor: function(record){
        if( my logic ){
            return Ext.create('Ext.grid.CellEditor', {
                field: Ext.create( 'Ext.form.field.ComboBox', {
                    forceSelection: true,
                    store: [[1, 'Option 1'], [2, 'Option 2']]
                })
            })
        } else return false;
    }
},